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?
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.
Answer: Use the jQuery . appendTo() Method You can use the jQuery . appendTo() method to move an element into another element.
Use appendChild to Append Data to Div in JavaScript Like the previous method, we first select the div by using one of the selectors. But instead of innerHTML , we use appendChild because of the problems discussed in the previous method. Before appending a child, we have to create the text node.
I took it directly from jQuery documentation http://api.jquery.com/append/
$( ".container" ).append( $( "h2" ) );
"If an element selected this way is inserted into a single location elsewhere in the DOM, it will be moved into the target (not cloned):"
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