Loop and remove empty element with jquery -

im close can't quite there.

i want add class display:none div if spans inside empty.

html:

 <div class="accordion-content default">     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure1'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure2'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure3'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure4'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure5'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure6'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure7'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure8'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure9'); ?></span></div>     <div><span><?php the_field(''); ?></span><span><?php the_field('tenure10'); ?></span></div>     <div><span>yearsl</span><span><?php the_field(''); ?></span></div> </div> 

jquery

   //hide unused fields //iterate on each div $('.accordion-content div').each(function(i, obj) { // if spans contain empty if ($('span:empty').html().length == 0 ) { //do not display parent div $('.accordion-content div').css({'display' : 'none'});     }; }); 

thanks.

edit: removes divs not ones empty span tags.

there 2 main problems:

1. $('span:empty') searches entire document empty span, , calling html() on result accesses html of first match. want within div via $(this).find("span:empty").

2. $('.accordion-content div').css({'display' : 'none'}); hides all matching elements.

also, no need call html(), know it's empty, , jquery has builtin function setting display: none on elements: hide.

if want hide div if any span inside empty, then:

$('.accordion-content div:has(span:empty)').hide(); 

if want hide div if all spans inside empty, then:

$('.accordion-content div').filter(function(i, obj) {     return $(this).find('span:parent').length == 0; }).hide(); 

that hide div if doesn't have spans @ all, completeness, hides ones have spans, empty ones:

$('.accordion-content div:has(span)').filter(function(i, obj) {     return $(this).find('span:parent').length == 0; }).hide();