Move div element from one parent div to another

javascript, jquery

Solution

Use `.appendTo()`

$('#likelyOddA').appendTo('#unlikelyToBeCalled')

Problem

So let's assume that I have a set of nested divs: ``` <div id="likelyToBeCalled"> <div id="likelyOddHeader" class="row"> <div id="likelyOddA" class="left" name="test1">Test1</div> <div id="LikelyOddB" class="middle"><img src="image002.png"/></div> <div id="timeZone" class="right">West</div> </div> ``` and further down the page: ``` <div id="unlikelyToBeCalled"> <div id="likelyOddHeader" class="row"> <div id="likelyOddA" class="left">Test2</div> <div id="LikelyOddB" class="middle"><img src="image002.png"/></div> <div id="timeZone" class="right">West</div> </div> ``` How would I move Test1 to "unlikelyToBeCalled". I've been trying this with a form / submit button just for kicks, here's the code for that: ``` <script type="text/javascript"> function doSubmit() { document.getElementById('unlikelyToBeCalled').appendChild( document.getElementsByTagName('Test1') ); } </script> <br /><br /><br /> <form method="POST" action="file:///C:/wamp/www/index.html" id="submitform" name="submitform"> <input type="submit" name="Submit" value="Move divs" onClick="doSubmit()" /> </form> ``` Or something to that effect. Any help would rock

Original source

Related problems