Remove a combination of empty elements within a section
<p>Within multiple sections (accordion), I have a combination of paragraphs and unordered lists (dynamically generated). </p>

<p>What I'm trying to achieve is to remove the empty tags/one or the other, or both if empty.  If both 'p' and 'ul' elements are empty remove its parent 'section'. </p>

<pre><code>    &lt;section&gt;
&lt;span&gt;-&lt;/span&gt;
  &lt;h3&gt;(a)Heading&lt;/h3&gt;
  &lt;div class="acc-box" style="display: block;"&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;ul&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
&lt;/section&gt;
&lt;section&gt;
 &lt;span&gt;-&lt;/span&gt;
  &lt;h3&gt;(b)Heading&lt;/h3&gt;
  &lt;div class="acc-box" style="display: block;"&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;p&gt;&lt;/p&gt;
    &lt;ul&gt;
      &lt;li&gt;&lt;a href="#" target="new.window"&gt;link&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" target="new.window"&gt;link&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" target="new.window"&gt;link&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" target="new.window"&gt;link&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
&lt;/section&gt;
 &lt;section&gt;
 &lt;span&gt;-&lt;/span&gt;
  &lt;h3&gt;(d)Heading&lt;/h3&gt;
  &lt;div class="acc-box" style="display: block;"&gt;
    &lt;p&gt;text here&lt;/p&gt;
    &lt;ul&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
</code></pre>
