Use jquery to remove a div with no children

Issue

How can I use jquery to remove a SPECIFIC div that has no children (at least no children that isn’t whitespace). E.g.

<div id="outer">
    some content
    <div id="removeme"> 


    </div>
    some more content
</div>

Want to completely remove the div with id=”removeme”.

Solution

To remove the element with id equal to removeme:

$("#removeme").remove();

To remove the element with id equal to removeme only if it is empty:

$("#removeme:empty").remove();

To remove all empty <div>s:

$("div:empty").remove();

EDIT: If it’s not empty, but has whitespace:

if($.trim($("#removeme").text()) == "") {
  $("#removeme").remove();
}

Answered By – Sophie Alpert

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published