Comment puis-je inverser l'ordre des éléments d'une liste ?

Index

Attention au titre : "inverser" au lieu de "changer" !

Plusieurs méthodes permettent de déplacer un élément du DOM.

Déplacer un élément du DOM dans un élément parent : append(), appendTo(), prepend(), prependTo().

Déplacer un élément du DOM par rapport à un autre : after(), insertAfter(), before(), insertBefore().

Exemple

Inversion des éléments "options" dans une liste de sélection multiple avec la méthode prependTo() :

Code HTML :

<select id="selectID" multiple="multiple" size="4">
	<option value="opt 1">Option n° 1</option>
	<option value="opt 2" selected="selected">Option n° 2</option>
	<option value="opt 3">Option n° 3</option>
	<option value="opt 4">0ption n° 4</option>
	<option value="opt 5" selected="selected">Option n° 5</option>
	<option value="opt 6">Option n° 6</option>
</select>
Code jQuery :
 
var jObjSelect = $( "#selectID" );

jObjSelect.find( "option" ).each( function( i, item ){ 
    $( item ).prependTo( jObjSelect );
});

Tests unitaires avec QUnit.