Anju Thapa
Anju Thapa

Reputation: 257

How to hide a div if it doesn't contain a table inside it

I have a div like this:

<div class="EventsRollup">
    <span class="EventsRollupTitle">Health Lecture Events</span>
    <!--this is where a table would be dynamically inserted by sharepoint 
        based on some filter, if filter is true, a tabel will get in there, 
        else not-->
</div>

Using jQuery, how do I hide the whole div if no table was inserted because the div has background color and the empty background color shows with no table contents?

Upvotes: 0

Views: 234

Answers (3)

jondavidjohn
jondavidjohn

Reputation: 62402

if ($('.EventsRollup').find('table').length === 0) {
    $('.EventsRollup').hide();
}

This assumes there is only one .EventsRollup... If there are more, you could use a loop...

$('.EventsRollup').each(function() {
    $this = $(this);
    if ($this.find('table').length === 0) {
        $this.hide();
    }
});

Upvotes: 3

user1106925
user1106925

Reputation:

$('.EventsRollup').not(':has(table)').hide();

or

$('.EventsRollup:not(:has(table))').hide();

Upvotes: 3

Esailija
Esailija

Reputation: 140228

jQuery( ".EventsRollup").filter( function(){
return !this.getElementsByTagName("table").length;
}).hide();

Upvotes: 2

Related Questions