sort a table based on the column values

Question

I want to sort a table when some button is clicked. If the button with id "easy" is clicked I want to sort by easy levels, if the button with id hard is clicked I want to sort by hard levels, in a descending order.

Im trying to do this for the easy button case and I already have the values in a array, but now Im not seeing how to sort this so the table can be sorted based on the easy values on the column "EasyLevels". Do you have some idea to help?

$("#easy").each(function() {
        if ($.inArray($(this).text(), arr) == -1)
            arr.push($(this).text());
        alert($(this).text());
    });

I have a table in this format:

ID | GameName | EasyLevels | HardLevels | TotalLevels

1    Stakeboard  32           28          60

....  

The html is like below, I dont have any class or id in any <td> .

<button id="easy">Sort By Easy Levels</button>
<button id="hard">Sort By Hard Levels</button>
<button id="total">Sort By Total Levels</button>

<table>
    <th>GameId</th>
    <th>GameName</th>
    <th>EasyLevels</th>
    <th>HardLevels</th>
    <th>TotalLevels</th>
    <tr>
        <td>Game Id</td>
        <td>Game Title 1</td>
        <td class="easy">12</td>
        <td class="hard">30</td>
        <td class="all">42</td>
    </tr>
    <tr>
        <td>Game Title 2</td>
        <td class="easy">10</td>
        <td class="hard">26</td>
        <td class="total">36</td>
    </tr>
    ....
</table>

Answer 1

You can achieve this using tablesorter jquery plugin:

$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
);