jQuery focusout for entire div and children

here is how I solved this for a menu using event.relatedTarget , :

$('#mapmenu  a.nolink').click(function (e) {//ul.lev-0 > li.expanded >
  $(this).closest('li').toggleClass('hovered');
  e.preventDefault();
  e.stopPropagation();
  return false;
});
$('#mapmenu  a.nolink').closest('li').focusout(function (e) {
  var ax = e.relatedTarget;
  var bx = $(ax).closest('ul');
  if ($(this).has(bx).length == 0) {
    $(this).removeClass('hovered');
  }
});

$("#yourDiv").focusout(function () {
   if ($(this).has(document.activeElement).length == 0) {
       // remove div
   }
});

$(this) = the div you're focusing out of.

document.activeElement = the element that is currently in focus.

$(this).has(document.activeElement) is simply checking if the active element is a child of your div

A way of solving this with plain javascript is using the relatedTarget given in the event argument:

element.addEventListener('focusout', function(event) {
    if (element.contains(event.relatedTarget)) {
        // don't react to this
        return;
    }
    // do something
});