¿Cómo cambiar la position de las tags HTML?

Si tengo el HTML:

<div id="divOne">Hello</div> <div id="divTwo">World</div> 

¿Es posible con CSS / JS / jQuery divTwo para que el contenido de divTwo aparezca en la position de divOne y viceversa? Solo estoy buscando cambiar la position de cada div, por lo que no quiero ninguna solución que implique establecer / intercambiar el HTML de cada div.

La idea es permitir que un usuario personalice el contenido del pedido que aparece en la página. ¿Es lo que estoy tratando de hacer una buena manera de resolverlo, o hay una mejor manera de lograrlo?

Se sentirá aliviado al saber que no es difícil usar jQuery.

 $("#divOne").before($("#divTwo")); 

Editar: si está hablando de implementar la funcionalidad de drag and drop para orderar los divs, eche un vistazo al complemento orderable de jQuery UI … http://jqueryui.com/demos/sortable/

Tal vez usando flotadores.

 #divOne { float: right; } #divTwo { float: left; } 

YMMV.

http://snipplr.com/view/50142/swap-child-nodes/ tiene el código para intercambiar 2 elementos entre sí.

También he modificado el mismo código para que también preserve los detectores de events ( addEventListener ) en los elementos que se intercambian y sus nodos secundarios.

 function swapNodes(node1, node2) { node2_copy = node2.cloneNode(true); node1.parentNode.insertBefore(node2_copy, node1); node2.parentNode.insertBefore(node1, node2); node2.parentNode.replaceChild(node2, node2_copy); }