jquery clone does not create unique object

Question

How do you clone a unique instance of a cloned list item? The way I have it currently coded, always creates a duplicate of itself - for example, I clone a list item once, it creates one copy, then I clone the same list item again and it creates two copies.

Here is the code:

HTML:

<ul>
    <li><button onclick='cloneit(this);'>Clone</button> List Item A</li>
    <li><button onclick='cloneit(this);'>Clone</button> List Item B</li>
</ul>

Javascript:

function cloneit(thisone) {
    var parent = $(thisone).parent();
    $(parent).clone().appendTo(parent);
}

You can see the above at this jsFiddle: http://jsfiddle.net/57kx6u3j/

To duplicate the problem, click on Clone for List Item A and you'll see it cloned once, then click on the same button and you'll see it cloned twice.

sahbeewah · Accepted Answer · 2014-08-27 00:34:33Z

4

You are appending a cloned li to the same li because this refers to the button element.

Fix: http://jsfiddle.net/57kx6u3j/1/

answered Aug 27, 2014 at 0:34

sahbeewah

2,6901 gold badge15 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery clone does not create unique object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related