Question

Hi all iam working on jquery here i have a html page. in the html i have two div’s in those firstdiv contains
image, name, and price right now we have to move(add) image to another div which is empty div here i had done to (move) add
image form first to secound but problem is when image added to the secound div the images should be appear in the
same place in first div and also in the secound div i had done to image add to secound div but images removes from the first div
this is my code follows:

               <div>              
                <span class="span1">
                <img src="~/Images/galaxy.jpeg" /></span> 
            <span class="span1">1232</span>
            <span class="span2">Cell Phone</span> 
            <span class="span1">3500</span>              
           <a href="#" class="pull-right" ><i class="icon-plus" onclick="AddToCart(this)" id="btnid" ></i></a>
        </div>


           <div class="span7" style="border:1px black" id="separat">
            </div>

in the above code iam having ‘icon-plus’ button when i click the button it adding image to the secound div but i need
images should add and it shoul appear in the same place also

and this is my jquery

              $(function () {             
       AddToCart(this);                
  });
    function AddToCart(obj) {
        var val = 0;
      var $this = $(obj).closest('div');
      var img = $this.find('img');
      var image=img;
      $('#separat').append(img);
      }

Could anybody please help me to do this?

Answer 1

you sholud use clone()

function AddToCart(obj) {
        var val = 0;
      var $this = $(obj).closest('div');
      var img = $this.find('img').clone();
      var image=img;
      $('#separat').append(img);
      }

http://api.jquery.com/clone/

The .clone() method performs a deep copy of the set of matched
elements, meaning that it copies the matched elements as well as all
of their descendant elements and text nodes. When used in conjunction
with one of the insertion methods, .clone() is a convenient way to
duplicate elements on a page.

UPDATE

if you want to get the prize and name

prize = $(obj).closest('.span2').clone();
name = $(obj).closest('.span1').clone();

$('#separat').append(img+prize+name);