Сортировка tr элементов по алфавиту

Question

Я пытаюсь сортировать tr, но мне не повезло.

Вот моя tr Структура.

<tr> 
    <td> 
     <a href="./BlueSky-TexasHealthResources/index.php" >Blue Sky-Texas</a> 
    </td> 
    <td> 
     <a href="./BlueSky-TexasHealthResources/view.php">View Data</a> 
    </td> 
    <td id="blue_sky_texas"> 

    </td> 
</tr> 
<tr> 
    <td id = 'bj'> 
     <a href="./BountyJobs/index.php" >Bounty Jobs</a> 
    </td> 
    <td> 
     <a href="./BountyJobs/view.php">View Data</a> 
    </td> 
</tr> 

Вот Javascript, который я пробовал далеко.

<script type="text/javascript"> 
var $tr = $("tr"); 

$(document).ready(function() { 
    var alphabeticallyOrderedTr = $tr.sort(function (a, b) { 
     return $(a).find("a:first").text().toLowerCase().localeCompare($(b).find("a:first").text().toLowerCase());   
    }); 
    $("#container").html(alphabeticallyOrderedTr); 
}); 
</script> 

И ниже изображение для таблицы (несортированным использованием кода выше) :(

Answer 1

.sort() является Array.prototyope метод, а не метод JQuery Попробуйте добавить .get() или .toArray() перед .sort(function(){}) называется;.. Например, $tr.get().sort(

$(document).ready(function() { 
 
    var $tr = $("tr"); 
 
    var alphabeticallyOrderedTr = $tr.get().sort(function(a, b) { 
 
    return $(a).find("a:first").text().toLowerCase().localeCompare($(b).find("a:first").text().toLowerCase()); 
 
    }); 
 
    $("#container").append(alphabeticallyOrderedTr); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table id="container"> 
 
    <tr> 
 
    <td> 
 
     <a>Y Jobs</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <a>Z Jobs</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td id='bj'> 
 
     <a href="./BountyJobs/index.php">Bounty Jobs</a> 
 
    </td> 
 
    <td> 
 
     <a href="./BountyJobs/view.php">View Data</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <a>X Jobs</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <a href="./BlueSky-TexasHealthResources/index.php">Blue Sky-Texas</a> 
 
    </td> 
 
    <td> 
 
     <a href="./BlueSky-TexasHealthResources/view.php">View Data</a> 
 
    </td> 
 
    <td id="blue_sky_texas"> 
 

 
    </td> 
 
    </tr> 
 
</table>