CODEWITHSUNDEEP
jqueryhtml
AJSwift
AJSwift

Reputation: 719

How to hide the parent div if the inner div is empty?

I want to hide the philosophy-bubble div which is styled to look like a speech bubble but if the inner div is empty the bubble is going to be an empty speech bubble which needs to be hidden. How do I do that using jQuery? 

<div class="philosophy-bubble">
   <div id="ctl00_PlaceHolderMain_ctl00_ctl15__ControlWrapper_RichHtmlField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl15_label">
     <DIV id="ctl00_PlaceHolderMain_ctl00_ctl15_RichHtmlField_displayContent" class="ms-rtestate-write" EmptyPanelId="ctl00_PlaceHolderMain_ctl00_ctl15_RichHtmlField_EmptyHtmlPanel" style="display:;">
     PROVIDING CARING AND KNOWLEDGABLE MEDICAL CARE TO PATIENTS
     </DIV>
  </div>
</div>

Upvotes: 1

Views: 734

Answers (3)

Alnitak
Alnitak

Reputation: 339786

This should do it for every such DIV on the page:

$('.philosophy-bubble').each(function() {
    var c = $(this).children().children(); // find the inner div
    if (c.html().length == 0) {            // check its content's length
        $(this).hide();
    }
});

Upvotes: 2

Blazemonger
Blazemonger

Reputation: 92893

Use .text() and $.trim to analyze the non-HTML content of each div:

$('div.philosophy-bubble').each(function() {
    if ($.trim($(this).text())==='') {
        $(this).hide();    // or .remove()
    }
});

Upvotes: 1

p1100i
p1100i

Reputation: 3740

if( !($('.philosophy-bubble').html()) ) $('.philosophy-bubble').hide();

Upvotes: 1

Related Questions