JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
<div class="blockelements">

</div>
   </div>

CSS

.block{
  width:200px;
  height:200px;
  border:1px solid;
}
.blockelements{
  height:100px;
  width:100px;
  border:1px solid
}

JavaScript

$(document).bind('click mouseup blur',function (e)
{
    var container = $(".block");

    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});