JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box">
        Absolute positioned box
        <div id="child">
            Child
        </div>
    </div>

CSS

#box{
    position:absolute;
    top:50px;
    left:50px;
    height:150px;
    width:300px;
    border:1px solid black;
}
#child{
    position:relative;
    width:200px;
    height:100px;
    left:50px;
    border:1px solid green;
}
body{
    height:100%;
    width:100%;
    background-color:red;


}

JavaScript

$(document).on("click", function(e) {
    if($(e.target).closest('#box').length != 1){
        $('#box').hide();
    }
});