<div id="wrapper">
<div id="example1">
<div id="navigation">
</div>
</div>
<div id="example2">
</div>
</div>
In the above example, let's say I want to remove #navigation from #example1 and place it in #example2. How can I use jQuery to do that? Do I just use remove
and add
or is there a simpler way?
All you have to do is select the element(s) you want to move, then call an “adding” method such as append() , appendTo() or prepend() to add the selected elements to another parent element. jQuery automatically realises that the element(s) to add already exist in the page, and it moves the element(s) to the new parent.
The detach() method removes the selected elements, including all text and child nodes. However, it keeps data and events. This method also keeps a copy of the removed elements, which allows them to be reinserted at a later time. Tip: To remove the elements and its data and events, use the remove() method instead.
jQuery uses: . append(); and . remove(); functions to accomplish this task. We could use these methods to append string or any other html or XML element and also remove string and other html or XML elements from the document.
$("#navigation").appendTo("#example2");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With