I want to remove the span using jQuery,
I have tried the .unwrap();
but it\'s not working.
$("span").each(function() {
var content = $(this).text();
$(this).remove();
$("a").html(content);
});
$('li').find('span').remove();
or
$('li').find('span').detach();
If you want to remove the wrapping only, try
var buffer = $('li').find('span').text();
$('li').find('span').parent().html(buffer);
Obviously, unwrap
doesn't work as the span
s only have text nodes inside them and jquery doesn't handle text nodes too well... this works however (you could use also jQuery.text
instead of jQuery.html
if you're sure that the span
only contains text):
$('li a span').replaceWith($('li a span').html());
Working example
Edit: Actually, it seems that unwrap
works as well if you use jQuery.contents to work around the jquery's inability to directly select text nodes:
$('li a span').contents().unwrap();
.remove()
http://api.jquery.com/remove/
:)
Unwrap should work. It's possible you're not successfully selecting the span which you wish to unwrap. You can try the following code which should select that span successfully:
$("li a span").unwrap()
It's a bit unclear from your question what exactly you're trying to do. It's also unclear whether you're having trouble with the selectors or with the jquery api. To get a better handle on jquery's selectors I recommend you install firebug and firequery, as it can really help you understand what you're selecting.