JQuery delete empty divs

user_15103978 0
Viewed 94

<div class="container-mob"></div>

I have multiple divs like this, some of them are empty (have no children) and all of them have the same class name. I want to remove the empty divs. I've tried:

if ($('.container-mob').is(':empty')) { 
          $('.container-mob').remove();
        }

Is there any way to do this with jQuery or JavaScript?

Screenshot divs

jquery javascript
2 Answers

Try this one: $('.container-mob:empty').remove()

console.log('all empty container',$('.container-mob:empty').length);

$('.container-mob:empty').remove();

console.log('after remove all empty container',$('.container-mob:empty').length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    
    <div class="container-mob"></div>
    <div class="container-mob"></div>
    <div class="container-mob"></div>
    <div class="container-mob"></div>
    <div class="container-mob">not empty</div>

user_113590760

You can simply get all empty div's like and call remove() function on empty div's array

HTML:

<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block">Data</div>
<div class="block"></div>
<div class="block">Data</div>

JQuery:

$(".block:empty").remove()
user_71306540
Related