How can I check if an element has any children element using jquery?

Question

I have a div that is floating left and the other floating right. I want to check if the div that is floating right has children element; if the it don't have any visible element, I want applied and new class to the left div. See below:

<div id="leftContent" class="left ">
    <table></table>
</div> 


<div id="rightContent" class="content">
    //the dom has no visible element
    //”#ctl00_ContentPlaceHolder1_ somegridView” is not visible     
</div>

And I’m using the following script:

$(document).ready(function() {
    if ($(“#ctl00_ContentPlaceHolder1_ somegridView”).lenght = 0) {

        $("# leftContent ").removeClass("left");
        $("# leftContent ").addClass("center");


    }
});

div.left { float: left; width: 365px; margin-left: 5px; padding-left: 2px; } div.center { padding: 2px; margin: 5px; float: none; width: 95%; clear: both; }

I want to know if div id="rightContent" is empty?

Answer 1

if ( $("#rightContent").children().length > 0)
{

   // do style changes

}

Answer 2

You can use is along with :empty.

if($('#rightContent').is(':empty')) {

}

Answer 3

Try this:

if ($('#rightContent').children().length === 0) {
    //Whatever
}

EDIT: Correct ID