JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent1">
    <div id="myDiv">ID Div 1</div>
</div>
<div id="parent2">
    <div id="myDiv">ID Div 2</div>
</div>
<span id="idCountJQ"></span> items jQuery selector.  Should always be 1.
<br>
<span id="idCountQSA"></span> items querySelectorAll().  Should always be 1.
<br/><br/>
<div class="parent1">
    <div class="myDiv">Class Div 1</div>
</div>
<div class="parent2">
    <div class="myDiv">Class Div 2</div>
</div>
<span id="classCountJQ"></span> items jQuery selector.  Should always be 1.
<br>
<span id="classCountQSA"></span> items querySelectorAll().  Should always be 1.

JavaScript

var idParent2 = document.getElementById("parent2");
var idDiv2JQ = $("#myDiv", idParent2);
$("#idCountJQ").text(idDiv2JQ.length);
var idDiv2QSA = idParent2.querySelectorAll("#myDiv");
$("#idCountQSA").text(idDiv2QSA.length);

var classParent2 = document.getElementsByClassName("parent2")[0];
var classDiv2JQ = $(".myDiv", classParent2);
$("#classCountJQ").text(classDiv2JQ.length);
var classDiv2QSA = classParent2.querySelectorAll(".myDiv");
$("#classCountQSA").text(classDiv2QSA.length);