CODEWITHSUNDEEP
jquery
Dymond
Dymond

Reputation: 2277

Hide div if another Div is empty

Im trying to hide a div if another div is empty, but for some reason it wont work as I want.

so basically I want to hide the <div class="more_post"> if the <div class="last_post"> element is empty

<div id="toggle-view">
        <div class="more_post">
            <h5>Load more</h5>
        </div>
        <ul class="toggle-view">
            <div class="toggle"">                     
                <div class="last_post"> </div>
            </div> 
        </ul>   
    </div>

Jquery

if($("#toggle-view ul.toggle-view .toggle .last_post").length ==0)
    {
    $("#toggle-view .more_post").hide();
    }

Upvotes: 1

Views: 4821

Answers (5)

SarathSprakash
SarathSprakash

Reputation: 4624

Try this out. It will work Simple method.

<script>
$(document).ready(function(){
if(!$.trim( $(".last_post").html() ) == true)
$(".more_post").hide();

});
</script>

Demo

Thank you

Upvotes: 1

Reactgular
Reactgular

Reputation: 54821

Try:

$("#toggle-view .more_post").toggle($("#toggle-view ul.toggle-view .toggle .last_post").html().length > 0);

Upvotes: 1

zurfyx
zurfyx

Reputation: 32807

Add .html() to read the HTML from the DIV first.

if($("#toggle-view ul.toggle-view .toggle .last_post").html().length ==0)
    {
    $("#toggle-view .more_post").hide();
    }

http://jsfiddle.net/gMC6F/

Upvotes: 1

Neeraj
Neeraj

Reputation: 4489

Try

if($("#toggle-view ul.toggle-view .toggle .last_post").html().length ==0)
{
$("#toggle-view .more_post").hide();
}

Demo

Upvotes: 1

Rahul Tripathi
Rahul Tripathi

Reputation: 172628

You can try something like this:-

if $('#toggle-view ul.toggle-view .toggle .last_post').is(':empty') $(this).hide()

Upvotes: 1

Related Questions