JSFiddle - React, Tailwind, and code Playground

HTML

<div tabindex="0" id="test">
    <div>Click</div>
</div>

CSS

div {
    border:2px solid #000;
    padding:20px;
    background-color:red;
}
div div {
    padding:8px;
    background-color:#FFF;
    cursor:default;
    width:200px;
}

JavaScript

var $div = $("#test"),
    $inner = $("#test > div");

$div.on("blur", function (e) {
    if( ! $inner.is(clicky) )
    {
        // your code here
        console.log("blur ");
    }       
}).on("focus", function (e) {
    console.log("focus")   
});


$(document).mousedown(function(e) {
        // The latest element clicked
        clicky = $(e.target);
});

$inner.click(function() {
  $div.focus();
});