jQuery .html() does not copy contents of textareas or inputs

input, jquery, textarea

Solution

$("button").click(function () {
    $("#2").html($("#1").html());
    $("#1").find("input").each(function(idx) {
        $("#2").find("input").eq(idx).val($(this).val());
    });
    $("#1").find("textarea").each(function(idx) {
        $("#2").find("textarea").eq(idx).val($(this).val());
    });
});

http://jsfiddle.net/gAMmr/5/

Problem

I'm trying to copy the contents of an element using `elem.html()` but it's not including the contents of `inputs` or `textareas`. Here's an example (try writting in the boxes then click "Copy"): http://jsfiddle.net/gAMmr/2/ Is there a way of copying all info? These are the approaches I have tried so far: - `elem.clone()` - not suitable for my task because it copies the element itself - `elem.children().clone()` - misses out text nodes - `elem.contents().clone()` - doesn't include the textarea contents EDIT: The results seem to be different in each browser. I'm using Chrome.

Original source

Related problems