how to clone content of a div to another div

Question

I want to copy the content of a selected div to another div with jquery clone. but I dont want to append it anywhere

what I mean is when we make a clone of a div with jquery (correct me if i am wrong) we have to set its position and it will dynamically create a new division which is displayed.

but I want to get the content of a selected div and copy it to another pre-set div

Solution 1

var a = $('#selector').html();
var b = $('#selector').html(a);

not sure I understood you properly but I think thats what you meant :)

Solution 2

I don't agree. Clone can save data without applying to the content.

Look here:

http://www.jsfiddle.net/dactivo/FqffM/

var mylayer=$('.hello').clone();

Here you can manage the variable "mylayer" as you want, and it's not in the DOM.

Solution 3

$("#from").clone().appendTo($("#to"));

But it will not remove/hide the main DIV. To hide the main div, do this:

$("#from").clone().appendTo($("#to"));
$("#from").remove();

Solution 4

$(".from").click(function () {
     $(".from").removeClass("CloneMe");
     $("#to").html('');
     $(this).addClass("CloneMe");
     $(".CloneMe").clone().appendTo("#to");

});

You can add a class on click (or other event) that is the hard coded to clone. In this example there is a list of same class names containing styled content (divs etc) - add the .CloneMe class but first remove that class to empty the div in case the user selects a different item. )to be safe remove any html as well. Then apply the class using (this) to avoid grabbing all of the items with that class name and finally append to the div. The result is the user can select any item with that class name and populate it in the container. - I imagine using a class for the container would allow you to populate it in more than one place.

---

View more solutions