JSFiddle - React, Tailwind, and code Playground

HTML

<div id="first">
   <span id="first-inner"></span>
</div>

<div id="second">
  <span id="second-inner"></span>
</div>

<div id="loop">
  <span id="loop-inner" class="check-loop"></span>
</div>

<span id="loop-outer" class="check-loop"></span>

<div id="extra-messages">
</div>

CSS

#extra-messages {
  margin-top:20px;
}

#extra-messages > * {
  display: block;
}

JavaScript

// Is #first-inner a descendant of #first?
if( jQuery.contains(jQuery("#first").get(0), jQuery("#first-inner").get(0)) ) {
	jQuery("#first-inner").text("Span with id 'first-inner' is a descendant of the div with id 'first'");
} else {
	jQuery("#first-inner").text("Span with id 'first-inner' is NOT a descendant of the div with id 'first'");
}

// Is #second-inner a descendant of #first?
if( jQuery.contains( jQuery("#first").get(0), jQuery("#second-inner").get(0) ) ) {
	jQuery("#second-inner").text("Span with id 'second-inner' is a descendant of the div with id 'first'");
} else {
	jQuery("#second-inner").text("Span with id 'second-inner' is NOT a descendant of the div with id 'first'");
}

// Loop it!
jQuery(".check-loop").each(function(idx, item){
	if( jQuery.contains( jQuery("#loop").get(0), item) ) {
  	jQuery("#extra-messages").append( jQuery("<div>div</div>").text("Span with id '" + jQuery(item).attr("id") + "' is a descendant of the div with id 'loop'"));
  } else {
  	jQuery("#extra-messages").append( jQuery("<div></div>").text("Span with id '" + jQuery(item).attr("id") + "' is NOT a descendant of the div with id 'loop'") );
  }
});