javascript - li を ul asc に並べ替えて追加する

Question

http://jsfiddle.net/Hms7Y/14/

上記のコードは、複雑な並べ替えアルゴリズムを使用せずに「レベル」に従ってアイテムを挿入する場合にうまく機能しますが、準備が整ったマークアップがない場合、レベル 2 が依然としてレベル 1 の上にあるという問題があります。

$(document).ready(function() {
  $('button').click(function() {
    var lvl = $('select').val();
    var ref = $('li.level' + lvl).last();
    var newLi =  $('<li class="level'+ lvl + '">' + lvl + ' </li>');

    console.log(ref);

    (ref.length > 0) ? newLi.insertAfter(ref) : $("ul").append(newLi);
  });
});

Answer 1

期待どおりに動作するようにフィドルを編集しました：http://jsfiddle.net/Hms7Y/23/

基本的に、クリックごとにこのコントロールを追加しました。

if($("ul").children().length>0){
    $("li").each(function(){
        if(lvl <= parseInt($(this).html())){
            newLi.insertBefore($(this));
        }else{
            newLi.insertAfter($(this));
        }
    });
}else{
    $("ul").append(newLi);
}