javascript - td のカスタム属性とテキストをルートとするテーブル行の並べ替え

Question

立ち往生しています。各レベルのテーブル行のカスタム属性に基づいてテーブルをソートし、td 自体のテキストに基づいてテーブルをソートする必要があります。したがって、すべてのレベルについて、より高いレベルを通過してソートします

ので、私は持っています：

<table>
<tbody>
<tr data-level="1" data-parent="0"><td>3</td></tr>
<tr data-level="1" data-parent="0"><td>1</td></tr>
<tr data-level="2" data-parent="1"><td>1b</td></tr>
<tr data-level="2" data-parent="1"><td>1c</td></tr>
<tr data-level="2" data-parent="1"><td>1a</td></tr>
<tr data-level="1" data-parent="0"><td>2</td></tr>
</tbody>
</table>

私の期待は次のようになります。

<table>
<tbody>
<tr data-level="1" data-parent="0"><td>1</td></tr>
<tr data-level="2" data-parent="1"><td>1a</td></tr>
<tr data-level="2" data-parent="1"><td>1b</td></tr>
<tr data-level="2" data-parent="1"><td>1c</td></tr>
<tr data-level="1" data-parent="0"><td>2</td></tr>
<tr data-level="1" data-parent="0"><td>3</td></tr>
</tbody>
</table>

私はこれを試しました：

function sortMultilevel(level){

    var $sort = this;
    var $table = $('table');
    var $rows = $('tbody > tr[data-level="'+level+'"]',$table);
    $rows.sort(function(a, b){
        var keyA = $('td',a).text();
        var keyB = $('td',b).text();
        if($($sort).hasClass('asc')){
            return (keyA > keyB) ? 1 : 0;
        } else {
            return (keyA < keyB) ? 0 : 1;
        }
    });
    $.each($rows, function(index, row){
      $table.append(row);
    });
}

function doMultilevelSort(){

    if($("tr").length > 0){
        $("tr").not(".sorted").each(function(){
            $(this).addClass("sorted");
            var level = $(this).attr("data-level");
            sortMultilevel(level);
            console.log("sorting: " + level);
        });
    }   
}

doMultilevelSort(); // call the function

私はこれを考えすぎているかもしれません。もし私があなたの生徒であり、私はすべての耳です。外観を高く評価します。