I recently had a similar challenge on a jQuery project.
The approach I wound up using employed 3 ULs, 2 of which are never seen by the user.
The first is simply all the raw data. When an LI changed, it would be changed in this first UL. The order of these LIs never change, only their values do. This one is not displayed on screen.
The second is a "sorting" UL. Whenever a change is made to the data, all the required data is copied into this second UL, and then sorted into whatever order is needed. This UL is also not displayed on the screen.
Finally, the third UL is the onscreen UL that is intended for your audience. This is simply copied from the 2nd "sorted" UL to display onscreen in whatever manner you desire.
The advantage of this is that you have 1 UL containing all the raw data you need for your project (hopefully with selectors that allow you to change individual bits as needed), 1 UL in which you can load in only specific needed items from that raw data, and which you can order as desired, and the final UL for displaying the data.
I hope this helps!