Remove Tag Around A Text Node Using Javascript

If I have some HTML that looks like this:

This is some text that is being written with a highlighted section

Solution 1:

You get the text, and replace the span with it:

var wrap = $('.highlight');
var text = wrap.text();
wrap.replaceWith(text);

Solution 2:

wrap it in a plugin

(function($) {   
    $.fn.tagRemover = function() {           
        return this.each(function() {            
        var $this = $(this);
        var text = $this.text();
        $this.replaceWith(text);            
        });            
    }    
})(jQuery);

and then use like so

$('div span').tagRemover();

Working Demo here - add /edit to the URL to play with the code

Solution 3:

This works:

wrap = $('.highlight');
wrap.before(wrap.text());
wrap.remove();

Solution 4:

This will do what you want, and also preserve any tags within the .highlight span.

content = $(".highlight").contents();
$(".highlight").replaceWith(content);

Solution 5:

text.replace(/</?[^>]+(>|$)/g, "");

Share