title: Get childnode by type or class instead of index
body: <p>I'm trying to get a specific child node from the DOM using JS or jQuery.
  I figured how to obtain a NodeList containing that node, but the <a href="https://www.w3schools.com/jsref/prop_node_childnodes.asp" rel="nofollow noreferrer">documentation</a> only specifies that one can access the nodes by index. This seems risky, as I have no guarantee of their order.</p>
  
  <pre><code>$(".axis")[0].childNodes()
  </code></pre>
  
  <p>returns the following <code>NodeList [...]</code></p>
  
  <pre><code>​
  0: &lt;g class="tick" style="opacity: 1;" transform="translate(0,319.94835680751174)"&gt;
  ​
  1: &lt;g class="tick" style="opacity: 1;" transform="translate(0,237.31924882629104)"&gt;
  ​
  2: &lt;path class="domain" d="M0,1H0V353H0" style="fill: none; stroke: rgb(34, 34, 34); shape-rendering: crispedges;"&gt;
  ​
  3: &lt;text&gt;
  ​
  length: 4
  </code></pre>
  
  <p>I doubt that looping through each node and checking its <code>HTML</code> for class or type is the best way. I tried <code>$(".axis")[0].childNodes.getElementsByClass("domain")</code> but this returns <code>TypeError: $(...)[0].childNodes.getElementsByClass is not a function.</code> </p>
  
  <p>Is their a more direct way to access them by type or class instead? </p>