Remove or hide a div if it's empty

Question

I know this should be simple but can't figure it out. Here's the code.

<div class="cols lmenu_item1" id="leftMenuWrapper">
<div id="leftmenu"></div>
</div>

I simply need to remove the "leftMenuWrapper" if "leftmenu" is empty. Here's what I've been using.

$('#leftmenu').empty().remove('#leftMenuWrapper');

Sorry if this is a simple question. Having a Monday!

Thanks!

Answer 1

You can do it like this:

$('#leftmenu:empty').parent().remove();

This only selects #leftmenu if it's :empty, and then only grabs the .parent() of that to .remove(). If it wasn't empty, then the first selector won't find anything, or any parent to remove either.