CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user3345367
user3345367

Reputation: 47

how to hide parent div from 2 child divs?

I have a parent div and 2 nested child divs. I want to hide the first child div and the parent div when the second child div doesn't contain any content.I was wondering how this could be done?

I want to hide #portfolio when .portfolio-works-container div is empty. 

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


          </div><!--/portfolio-works-container-->
        </div><!--/portfolio-works-->
   </div><!--/portfoio-->

Upvotes: 0

Views: 149

Answers (5)

anant prajapati
anant prajapati

Reputation: 177

Try this:

jQuery(document).ready(function($){
    if($.trim($('.portfolio-works-container').html()).length == 0){
         $('#portfolio').hide();         
    }
});

Please check this : jsfiddle url

Upvotes: 3

Felix
Felix

Reputation: 38102

You can use:

if($('.portfolio-works-container').contents().length == 0) {
    $('#portfolio').hide()
}

Upvotes: 1

Arbel
Arbel

Reputation: 30999

Since you are already using jQuery (as the question is tagged):

if ($('.portfolio-works-container').html()=='')
    $('#portfolio').hide();

Upvotes: 0

sshet
sshet

Reputation: 1160

IN order to hide parent div you need to find the parent element using parent() function of jquery. In below code you will check if div is empty then find parent divs and hide them

if( !$.trim($('.portfolio-works-container').html()) ) {
   $(this).parent().hide();
   $(this).parent().parent().hide();

}

Upvotes: 0

Kiran
Kiran

Reputation: 20313

Use .is() and :empty() selector. Try this:

if($(".portfolio-works-container").is(':empty')){
   $("#portfolio").hide();
}

Upvotes: 1

Related Questions