jQuery Tutorial Tutorials - jQuery .clone() method

The .clone() method in jQuery is used to create a deep copy of jQuery object of matched elements.

jQuery .clone() method Syntax

.clone([withDataAndEvents])

withDataAndEvents is used to determine whether to copy the element data and event handlers.

jQuery .clone() method Example

example

Clones all b elements (and selects the clones) and prepends them to all paragraphs.

// HTML 
// <b>Hello</b><p>, how are you?</p>

$("b").clone().prependTo("p");

// Result
// <b>Hello</b><p><b>Hello</b>, how are you?</p>

example

Create a copy of the element and it has the same functions:

// HTML 
// <b>Hello</b><p>, how are you?</p>
$("b").click(function(){
    $(this).css('color','red');
})

$("b").clone(true).prependTo("p");

// Result
// <b>Hello</b><p><b>Hello</b>, how are you?</p>

Try now