Using jquery how can I remove a DIV if it's contents are empty?
I'm looking for a way to remove the following empty div using jquery.
The following div is output sometimes without content inside it. For display reasons I need to remove it when it's empty.
开发者_运维知识库<div class="field-group-format group_call_to_action_aside div group-call-to-action-aside box yellow speed-fast effect-none"></div>
Thoughts?
I've been trying the following and variations of it, but have't had any luck.
This works, assuming you don't have other div.group_call_to_action_aside
that you want to keep:
if ($('.group_call_to_action_aside').is(':empty')) {
$('.group_call_to_action_aside').remove();
}
Note: I've styled the div
, so you can see a brief flash of it before the js takes effect. but you won't see this when you do it because the div
is empty. ;-)
http://jsfiddle.net/jasongennaro/L8dwn/
EDIT
Yes, as per your commment, you can also do this
$('.group_call_to_action_aside:empty').remove();
http://jsfiddle.net/jasongennaro/L8dwn/1/
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();
}
Reference: Use jquery to remove a div with no children
精彩评论