Question

I have a div element like

<div id="move">Something</div>

…that I’d like to move from one position to another in the DOM. Can I do this with appendTo(), like so:

$('#move').fadeOut(500, function() {
   $(this).appendTo('#another-container').fadeIn(500);
});

…or will this duplicate it?

If it’s being duplicated, there would be two elements with the same id in the DOM. How could I avoid this?

Answer 1

Yes, the appendTo method moves elements from the DOM tree. If you want to copy an element, .clone() is used.

Example:

Body:   <div>
           <a>Test</a>
        </div>
        <span></span>
jQuery code:
   $("a").appendTo("span");

After:  <div></div>
        <span>
           <a>Test</a>
        </span>