JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div id="mydiv">
My div
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
</div>
<div>Some random div<br>blablabla<br>bla</div>
<div>Another random div<br>blablabla<br>bla</div>
<div id="div-exception">Click me, I won't complain!</div>
</body>
CSS
body {
background-color: #C88;
}
div, ul {
border: 1px solid #DDD;
margin: 10px;
padding: 10px;
}
#mydiv, #div-exception {
background-color: #8C8;
}
JavaScript
$(document).click(function(e) {
if (($(e.target).closest("#mydiv").attr("id") != "mydiv") &&
$(e.target).closest("#div-exception").attr("id") != "div-exception") {
alert("Clicked outside!");
}
});