change div display order using javascript? (starter add/remove code included)

[ultrus]

I'm creating a photo gallery admin page where photos can be rearranged once added. Without reloading the whole page using php to change sort order, is there a way in javascript that I can move <div> siblings over and under each other dynamically? Here's some starting code that will append and remove items. Now I just need to be able to sort them:

 

<script type="text/javascript">
var itemInt = 0;
function addItem() {
	var itemDiv = document.getElementById('items');
	var newDiv = document.createElement('div');
	var newID = 'item' + itemInt;
	newDiv.setAttribute('id',newID);
	newDiv.innerHTML = 'You added me! I\'m known as ' + newID + '. <a href="javascript:;" onClick="deleteDiv(\'' + newID + '\');">[-] Delete This</a>';
	itemDiv.appendChild(newDiv);
	itemInt++;
}

function deleteDiv(theDiv) {
	var itemDiv = document.getElementById('items');
	var deadDiv = document.getElementById(theDiv);
	itemDiv.removeChild(deadDiv);
}
</script>

<div id="items"></div>

<div><a href="javascript:;" onclick="addItem();">[+] Add Item</a></div>

 

Any ideas on this? Thanks much in advance.

 

 

[ultrus]

I think I found what I'm looking for: nextSibling, previousSibling, and swapNode.