title: get a nested element inside a div by class name
body: <p>I am trying to get an <strong>span</strong> element which has a class of <strong>main-tag</strong> inside a nested <em>div</em>. But i don't want to get that element through <em>querySelector</em> as there are many elements in my html file with the same class and i don't intend to use IDs for that.</p>
  <p>I know i am making some mistake in my recursive function. That's why this code is not working.</p>
  <p>So for this i'm recursively calling a function to get the desired element. But <em>undefined</em> is returned by <strong>found</strong> variable.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function getElem(cell, name) {
    let found;
    if (cell.classList.contains(name)) return cell;
    else if (cell.children.length === 0) return null;
    else {
      found = Array.from(cell.children).find((element) =&gt;
        element.classList.contains(name)
      );
      if (found === undefined) {
        Array.from(cell.children).forEach((element) =&gt; {
          found = getElem(element, name);
        });
      } else return found;
    }
  }
  
  
  console.log(getElem(document.getElementById("block-one"), "main-tag"));</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="block-one"&gt;
    &lt;div class="something-one"&gt;
      &lt;span class="something-two"&gt;Hello&lt;/div&gt;
      &lt;span class="abc"&gt;not found&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="here"&gt;
      &lt;span class="main-tag"&gt;Yes, i am here&lt;/div&gt;
      &lt;span class="bogus-tag"&gt;never find out&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>