JSFiddle - React, Tailwind, and code Playground

HTML

<b>Items:</b>

<div class="item">
    <span class="span1">
        <img src="http://placehold.it/50x50&text=item1" />                
    </span>
    <span class="span1 item-id">1232</span>
    <span class="span2 name">Cell Phone 1</span>
    <span class="span1 price">3500</span>
    <a href="#" class="pull-right"><i class="icon-plus">Add</i></a>
</div>

<div class="item">
    <span class="span1">
        <img src="http://placehold.it/50x50&text=item2" />                
    </span>
    <span class="span1 item-id">1232</span>
    <span class="span2 name">Cell Phone 2</span>
    <span class="span1 price">4500</span>
    <a href="#" class="pull-right"><i class="icon-plus">Add</i></a>
</div>

<b>Cart:</b>

<div id="separate"></div>

JavaScript

$("body").delegate(".item a", "click", function(event) {
    event.preventDefault();
    item = $(this).closest(".item");
    elems = ["img", ".name", ".price"];
    fragment = document.createDocumentFragment();

    for (var i = 0; i < elems.length; i++) {
        el = item.find(elems[i]).clone();
        fragment.appendChild(el[0]);
    }

    $("#separate").append(fragment);
});