jQuery Append Appending an element to a container


Example

Solution 1:

$('#parent').append($('#child'));

Solution 2:

$('#child').appendTo($('#parent'));

Both solutions are appending the element #child (adding at the end) to the element #parent.

Before:

<div id="parent">
  <span>other content</span>
</div>
<div id="child">

</div>

After:

<div id="parent">
  <span>other content</span>
  <div id="child">

  </div>
</div>

Note: When you append content that already exsists in the document, this content will be removed from its original parent container and appended to the new parent container. So you can't use .append() or .appendTo() to clone an element. If you need a clone use .clone() -> [http://api.jquery.com/clone/][1]