modifying a cloned element and reinserting in dom - jquery
- by Praveen Prasad
//dom
<div id='toBeCloned'><span>Some name</span></div>
<div id='targetElm'></div>
//js
$(function () {
//creating a clone
var _clone = $('#toBeCloned').clone(true);
// target element
var _target = $('#targetElm');
//now target element is to be filled with cloned element with data of span changed
var _someData = [1, 2, 3, 4];
//loop through data
$.each(_someData, function (i, data) {
var _newElm = {};
$.extend(_newElm, _clone);//copy cloned to new Elm
_newElm.find('span').html(data); //edit content of span
alert('p'); // alert added to show that append in next line inspite of adding new element to dom just updating the previous one
_target.append(_newElm);//update target
});
});
expected Result:
1 2 3 4
resut iam getting is
4