Move div element from one parent div to another
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
使用.appendTo()
$('#likelyOddA').appendTo('#unlikelyToBeCalled')
If I understand what you want:
$('div[name=test1]').appendTo('#unlikelyToBeCalled');
getElementsByTagName('Test1') will not get element with name="Test1" , it is supposed to, for example, get all div s (with code getElementsByTagName('div') of course). Next, you have used #likelyOddHeader and other id s twice, but id must be unique.