RayLoveless
RayLoveless

Reputation: 21038

Check if the content of a DIV is empty in jQuery

How do I use jQuery to check to see if the content of a <div> is empty?

I tried this and is doesn't seem to be printing the correct values.

...
var unframed_items = $("#unframed-items");
alert(unframed_items.html().length);
...
<div id="unframed-items"> </div>
...

Upvotes: 13

Views: 32128

Answers (3)

Mojtaba Homayoun
Mojtaba Homayoun

Reputation: 57

Use $('#elementId').is(':empty').

Upvotes: -1

user5296864
user5296864

Reputation:

<div id="portfolio"><!--portfolio-->
<div id="portfolio-works"><!--portfolio-works-->
    <div class="portfolio-works-container"></div>
</div><!--/portfolio-works-->

 $(document).ready(function(){
    if($('div.portfolio-works-container').is(':empty')){
        $('div#portfolio').hide();
    }
});

Upvotes: 0

user113716
user113716

Reputation: 322452

If you mean really empty, use the empty-selector[docs] :

alert( !!$("#unframed-items:empty").length )

or

alert( $("#unframed-items").is(':empty') )

If you consider whitespace-only to be empty, then use the jQuery.trim()[docs] method:

alert( !$.trim( $("#unframed-items").html() ) );

Upvotes: 24

Related Questions