sergserg
sergserg

Reputation: 22264

Copying img element to another div using jQuery

I have a have simple div with a single image. I want to copy that same img element to another div.

$('.copy').click(function() {
    imageElement = $(this).siblings('img.source')[0];

    item = $('<div class="item">' + imageElement + '</div>');
});

I'm getting this:

[object HTMLImageElement]

Instead of the actual image tag rendering. Any ideas?

Upvotes: 3

Views: 16490

Answers (5)

summsel
summsel

Reputation: 88

try this:

$(".copy").on("click",function(){
    $("#a_clone").clone().appendTo("#b_clone"); 
});

Upvotes: 0

Derek
Derek

Reputation: 1

Since your img is within another div, you could use the .html() function.

Something like this:

$('.copy').on('click', function(){
    var orig = $(this).children('img');
    var otherDiv = $('#otherDiv');
    otherDiv.html(orig.html());
});

Upvotes: 0

Sree
Sree

Reputation: 556

Try this

    $('.copy').click(function() {
         var imageElement = $('#div1').html();
         $('#div2').html(imageElement);
    }

If you don't need to replace content in #div2 use "append" or "prepend" instead of html. Eg : $('#div2').prepend(imageElement);

Upvotes: 0

sudhansu63
sudhansu63

Reputation: 6180

try this.

$('.copy').click(function() {
    imageElement = $(this).siblings().find('img').eq(0);

 $("div.item").append(imageElement.clone());


 });

Upvotes: 0

maverickosama92
maverickosama92

Reputation: 2725

try this:

$("#btnCopy").on("click",function(){
    var $img = $("#firstDiv").children("img").clone();
    $("#secondDiv").append($img);
});

working fiddle here: http://jsfiddle.net/GbF7T/

Upvotes: 8

Related Questions