Move items in a list with DOM

Tested with IE 6 and Firefox 1.5x. Not sure that this is the canonical way to do it. Better use real event handlers I guess . Just "View source" to look at the code.

Move elements of a simple list without whitespaces

Click on up or down. It will move elements in the list.

Move divs within a div

Click on up or down. It will move elements. Note: works for DIVs within a DIV.
Item 1 thing
Item 2 car
Item 3 computer
Item 4 which is a bit longer
Item 5 apple
Your name:

Note: FF DOM does have whitespaces which should be taken out either in the original HTML or with some DOM hacking. Alternatively one could modify the move_div function to test the sibling and if it is empty go to the next one. Here we just make sure that divs/lis have no whitespace in between ;)

Move elements of a simple list without whitespaces

This works with whitespaces. Click on up or down. It will move elements in the list.

Inspiration: http://forums.devshed.com/javascript-development-115/swapping-dom-element-order-ff-bug-359361.html


This is freeware code. DKS
Last modified: Mon Jul 3 14:17:41 CEST 2006