jquery dom object to string

Question

i have a textarea with contents of html file. The textarea content includes my entire html page content, includes the doctype, head, html etc.

now, i want to save the textarea into a dom vairable via $.parseHTML:

var txt = $.parseHTML($("textarea").val(), null, true);

next, i change my txt variable and dom elements with commands like:

$(txt).find("h1").text("demo");
$(txt).find("h2").text("demo h2");

after changing the txt dom i want to put the txt as string back to the textarea, but nothing seems to work. i already tried:

$("textarea").val($(txt).html());

or

$("textarea").val(txt.html());

i also tried looping the dom:

$.each($(txt).get(),function(){
    v = $("textarea").val();
    $("textarea").val(v+$(this)[0].outerHTML);
});

but that didn't gave the expected results as items outside the body tag haven't translated back.

any advise shall be greatly appriciated

Answer 1

var txt = $('#textarea').val();
var html = $('<div class="wrap">'+txt+'</div>');
$('h1', html).text('is H1');
$('h2', html).text('is H2');
$('#textarea').val(html.html());`