Search code examples
javascriptjquerydomjquery-clone

Clone Element without Children

Is there a way to copy an element without copying it's children?

My goal is to duplicate a table, along with all classes, inline styles, etc. But I do not want to copy any of the table element's children.

I realize I could copy the entire table and then remove the children from the copy. But I want to minimize screen flicker and I seem to recall there are problems manipulating elements before they are visible in the DOM.

Any suggestions?

Solution

  • Have you considered using native cloneNode? The argument controls whether children should be cloned as well.

    var clone = table.cloneNode(false);

    This does not clone event handlers though. I'm not sure about styles set via the DOM API (probably not).