Как удалить пустые элементы после класса? (JQuery)

Question

У меня есть ряд элементов после определенного класса, которые пусты или имеют пробел внутри него.

<div class="post-content"> 
    <div class="slider-1-smart"> 
    --- contents of the slider --- 
    </div> 

    <div></div> 
    <div> </div> 

    <ul> 
     <li>Text 1</li> 
     <li>Text 2</li> 
     <li>Text 3</li> 
    </ul> 
</div> 

Это код, который я пытался до сих пор:

$(function() { 
    $('.post-content > div:empty').each(function() { 

     j(this).remove(); 

    }); 
}); 

Результатом этого кода является то, что контейнер слайдер dissappears. Какой способ выбрать элементы после класса = «слайдер-1-умный» и удалить его

Пожалуйста, дайте мне знать, спасибо

Answer 1

:empty psuedo-class только выбирает элементы, которые полностью пусты. Другими словами, если у него есть пробелы, это технически не считается пустым.

Вы можете выбрать все следующий родственный div элементы с .nextAll(), а затем фильтровать их на основе того, обрезанный HTML равно пустой строке:

Example Here

$('.post-content > .slider-1-smart').nextAll('div').filter(function() { 
    return $.trim($(this).html()) === ''; 
}).remove(); 

Answer 2

Если вы не хотите чтобы проверить содержимое элемента слайдера, все, что вам нужно сделать, это сделать одну модификацию кода. Добавьте .not("slider-1-smart") в селекторную цепь.

$(function() { 
    $('.post-content > div:empty').not(".slider-1-smart").each(function() { 

     $(this).remove(); 

    }); 
});