Replace HTML Using jQuery

Question

function toText()
{
    var convertHTML =$('#mainContent').html();
    var ele = $(convertHTML + " > span").each(function(){
        $(this).replaceWith($(this).text());
    });
    console.log(ele);


}

My aim is to replace the following content

    <div id="mainContent">
    test
<br>
    1234
<br>
    <span class="underline">test</span>
<br>
    <span class="underline">1234</span>
    </div>

And want my function to output test  1234 test 1234

This is why i cant just use text() as it takes away the   aswell!

Asciiom · Accepted Answer · 2012-08-24 08:40:27Z

3

Try it like this:

function toText()
{
    var ele = $("#mainContent > span").each(function(){
        $(this).replaceWith($(this).text());
    });
    console.log(ele);
}

You where using an entire block of html as a jQuery selector :)

answered Aug 24, 2012 at 8:40

Asciiom

9,9757 gold badges42 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

nnnnnn · Accepted Answer · 2012-08-24 08:45:33Z

1

You were taking the html string returned from $("#mainContent").html() and trying to use it as part of the selector on the next line, when really the selector you need is "#mainContent > span".

Try this instead:

function toText()
{
    $("#mainContent > span").replaceWith(function(){ return $(this).text(); });
}

You don't need an .each() loop: if you pass a function to .replaceWith() that function is called once for each element in your jQuery object and your return value is used as the replacement for the current element.

Demo: http://jsfiddle.net/7xKzP/

answered Aug 24, 2012 at 8:45

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

Comments

AdityaParab · Accepted Answer · 2012-08-24 08:40:37Z

1

convertHTML from var convertHTML =$('#mainContent').html(); is not a jQuery object

You will have to write

var ele = $("#mainContent > span").each(function(){
        $(this).replaceWith($(this).text());
    });

Reason :

$('#mainContent').html(); will return you the string not a jQuery object for $.each to work.

var ele = $(convertHTML + " > span") would mean

var ele = $("test 1234 test 1234" + " > span")

answered Aug 24, 2012 at 8:40

AdityaParab

7,1003 gold badges30 silver badges40 bronze badges

Collectives™ on Stack Overflow

Replace HTML Using jQuery

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related