jQueryを使って要素を並べ替えるサンプル

「Sorting elements with jQuery」にてテーブルやリストのソートの作り方を紹介していました。

指定したエレメントを並べ替えたり、並び替えのルールを自分で作り込みができるため、実務で使う場合に良さそうです。

詳しくは以下

並び替え方法などの自由なカスタマイズが可能

jQueryでテーブルをソートさせるプラグインはいくつかありますが、デザインが入っていたり、並び替え方法のカスタマイズが難しかったりして実務で使えるものは少なかったと思います。

以下のような設定で実装できるようです。

htmlは単純なリスト要素で作成します。

<ul>
    <li>Banana</li>
    <li>Carrot</li>
    <li>Apple</li>
</ul>

並び替えのルールは自前で構築する必要があります。
アルファベット順にする場合

$('li').sort(function(a, b){
    return $(a).text() > $(b).text() ? 1 : -1;
});

数値順にする場合

$('li').sort(function(a, b){
    return  (isNaN(a) || isNaN(b) ?
        a > b : +a > +b
    ) ?
        inverse ? -1 : 1 :
        inverse ? 1 : -1;
});

並び替えをJavaScriptで実現したい場合にいかがでしょうか。