title: How do I check if an element contains at least one direct text node
body: <p>How do I check if an element contains <strong>at least one direct text node</strong> ?</p>
  <p>Given:</p>
  <pre><code>&lt;div id=&quot;a&quot;&gt;
    One &lt;span&gt;Two&lt;/span&gt;
  &lt;/div&gt;
  
  &lt;div id=&quot;b&quot;&gt;
    &lt;span&gt;Three&lt;/span&gt;
  &lt;/div&gt;
  
  &lt;div id=&quot;c&quot;&gt;
    Four
  &lt;/div&gt;
  
  &lt;div id=&quot;d&quot;&gt; &lt;/div&gt;
  </code></pre>
  <p>And:</p>
  <pre><code>function containsDirectText(el) {
    // using plain Javascript, not jQuery
  }
  </code></pre>
  <p>Then:</p>
  <pre><code>containsDirectText(document.getElementById('a')) // should return true
  containsDirectText(document.getElementById('b')) // should return false
  containsDirectText(document.getElementById('c')) // should return true
  containsDirectText(document.getElementById('d')) // should return false (just empty space counts as no text)
  </code></pre>