hide a DIV when the user clicks outside of it

Byadmin

 

Here is the Example of it.

<div class=”jumbo”>
<h1>this is sample div</h1>
<p> plz click outside of this div.</p>
</div>

<style>
.jumbo {
position: fixed;
background-color: #008cff;
color: #fff;
padding: 100px;
margin: 0 auto;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}

</style>

<script>

$(document).mouseup(function(e) {
var container = $(“.jumbo”);
if (!container.is(e.target) && container.has(e.target).length === 0)
{
container.hide();
}
});

</script>