jquery removing empty elements and their empty children
<p>So I have dynamic content and want to remove empty elements and empty child elements (if any). There is a few scenarios that occur:</p>

<p>HTML</p>

<pre><code>&lt;p&gt; &lt;/p&gt;

&lt;p&gt;&lt;img src="image.jpg" /&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;/strong&gt;&lt;/p&gt;
</code></pre>

<p>jQuery</p>

<pre><code>$(".articleContent p").filter( function() {
    return !($.trim($(this).text()).length) &amp;&amp; !($(this).children().length);
}).hide()
</code></pre>

<p>Problem is it doesn't account for empty child elements. I've tried tweaking and it either hides the img or the empty child elements.</p>

<p>Suggestions?</p>
