Question

0

358

Views

How can I hide divs if they are empty?

I have some divs that maybe be empty (depending on server-side logic).

<div id="bar">

<div class="section" style="display:block;"></div>
<div class="section" style="display:block;"></div>
<div class="section" style="display:block;"></div>

</div>

If they don't have any html inside the div's (with class section), I just want to hide them.

How can I do this?

over 4 years ago · Santiago Trujillo

3 answers

Answer question

0

Here is a CSS3 solution for anyone who is interested

div:empty {
  display:none;
}

over 4 years ago · Santiago Trujillo Report

0

Why does nobody use .filter ?

$("div.section").filter(function() {
    return this.childNodes.length === 0;
}).hide();

This is a more elegant solution compared to using .each.

over 4 years ago · Santiago Trujillo Report

Answer question

Find remote jobs

Accepted Answer · 2022-05-24T14:36:34.039Z

jQuery has a :empty selector. So, you can simply do:

$('div.section:empty').hide();

0

358

How can I hide divs if they are empty?

3 answers

0

0

0

Find remote jobs

Andres GPT