jQuery Remove/Clone

Question

test 123<br>
    test <span class="underline" id="1" onclick="test1(this);">hez
    <ul class="spellCheck_suggest">
        <li data-wordid="1" onclick="test(this);">heyerdahl</li>
        <li data-wordid="1" onclick="test(this);">heywood</li>
        <li data-wordid="1" onclick="test(this);">hezekiah</li>
        <li data-wordid="1" onclick="test(this);">hf</li>
        <li data-wordid="1" onclick="test(this);">hg</li>
        <li data-wordid="1" onclick="test(this);"><font color="red">hez</font></li>
    </ul>
    </span>

Above is the HTML i have within one of my DIV tags.

Currently i do the follwoing code which works fine...

$(".spellCheck_suggest").remove();
 var mainContentHTML = $("#" + mainContent).html();

Which removes all .spellCheck_suggest classes from my dom, then gives me the html code of the above html which should only be:

test 123<br>
test <span class="underline" id="1" onclick="test1(this);">hez</span>

But the weird issue is if i try to clone

 var divclone= $("#divid").clone();

and then try and do either..

divclone.replaceWith(".spellCheck_suggest","");
divclone.remove(".spellCheck_suggest");

It doesnt remove it... My plan is to remove it then return the .html() to the user

Im i using clone or remove wrong?

Answer 1

Try:

$(".spellCheck_suggest", divclone).remove();