Modify and switch positions of floating elements

How would one go about modif开发者_如何学Cying the positions of floating elements? Is it possible with simple HTML/CSS? If not, what would be the simplest way using JavaScript w/ and/or w/o jQuery?

Example: http://jsbin.com/ufeme3/2

Simplest way is to pick first element and put it after third using insertAfter method. Them pick fourth element and insert before first element in row using insertBefore. But using that method could cause situation, where elements will be in incorrect places for a while in moment of rearranging.

Second way could look like this:

1. Wrap all 5 elements in some wrapper with position: relative.
2. Before switching elements take the position (jQuery's position method for example) of each element and set it for them(top, left etc.), additionally adding position: absolute to them.
3. Hide first and fourth element - other elements will stay at their positions, because they positioned absolutely.
4. Put removed elements in correct places.
5. Remove previously added css properties.

Elements should stay in their places and be replaced without moving others.