JSFiddle - React, Tailwind, and code Playground

HTML

<body id="3">
 <div id=0></div>
 <div id="context" foo=bar>
  <div id=1></div>
  <div class="class" id=2></div>
  <div class="withChildren" id=3><div class=child id=4></div></div>
 </div>
 <div id=5></div>
 <div id=6></div>
 <pre id="output"></pre>
</body>

JavaScript

var findAll = function(selector) {
   var e = document.getElementById("context");
    $("#output").append("<p>'" + selector + "': [" + $(e).find(selector).map(function() { return this.id }).toArray().join(", ") + "]</p>");
};

findAll("div")  // returns ids 1,2,3,4
findAll("")      // returns an empty list
findAll("#3")  // returns id 3, but not the body node
findAll("> div") // returns ids 1,2,3
findAll("[foo=bar]") // returns nothing
findAll("[id=1]") // returns id 1
findAll(":first-child") // returns id 1
findAll("+ div") // returns id 5
findAll("~ div") // returns id 5, 6