title: Remove empty node elements from DOM
body: <p>What is the best way to identify and remove empty elements from the dom WITHOUT jQuery?</p>
  <p>If I have code that looks like this:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div&gt;
      &lt;div&gt;
          &lt;p&gt;&lt;/p&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;p&gt;Some content&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>What is the best way to get rid of both the empty <code>&lt;p&gt;</code> and <code>&lt;div&gt;</code>?</p>
  <p>I tried this: <a href="https://www.sitepoint.com/removing-useless-nodes-from-the-dom/" rel="nofollow noreferrer">https://www.sitepoint.com/removing-useless-nodes-from-the-dom/</a> but for some reason it cleaned out all of the spaces in my spans.</p>