jQuery reversing the order of child elements

Question

What is the best way to reverse the order of child elements with jQuery.

For example, if I start with:

<ul>   <li>A</li>   <li>B</li>   <li>C</li> </ul> 

I want to end up with this:

<ul>   <li>C</li>   <li>B</li>   <li>A</li> </ul> 

Answer 1

var list = $('ul'); var listItems = list.children('li'); list.append(listItems.get().reverse()); 

Answer 2

Edit: Anurag's answer is better than mine.

ul = $('#my-ul'); // your parent ul element ul.children().each(function(i,li){ul.prepend(li)}) 

If you call .prepend() on an object containing more than one element, the element being appended will be cloned for the additional target elements after the first, so be sure you're only selecting a single element.