Quiero ordenar todos los valores, pero jquery ordena solo tres valores. Quiero ordenar varias tablas en la etiqueta h2, pero cuando lo ordeno, solo ordeno los primeros 3 valores, pero quiero todos los valores.
$('#alphBnt').on('click', function() { var sorting = $(".box").sort(function(a, b) { return $(a).find("h2").text() > $(b).find("h2").text(); }); $("#container").html(sorting) }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <p><button id="alphBnt">Sort</button></p> <div id="container"> <table border=2px class="box"> <tr> <td class="name"> <h1>mui</h1> </td> <td class="number"> <h2>4512</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>oinecellars</h1> </td> <td class="number"> <h2>566</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>zacchus </h1> </td> <td class="number"> <h2>34566</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>zacchus </h1> </td> <td class="number"> <h2>1</h2> </td> </tr> </table> </div>Necesitas usar - :
$('#alphBnt').on('click', function() { var sorting = $(".box").sort((a, b) => $(a).find("h2").text() - $(b).find("h2").text()).appendTo("#container") }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <p><button id="alphBnt">Sort</button></p> <div id="container"> <table border=2px class="box"> <tr> <td class="name"> <h1>mui</h1> </td> <td class="number"> <h2>4512</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>oinecellars</h1> </td> <td class="number"> <h2>566</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>zacchus </h1> </td> <td class="number"> <h2>34566</h2> </td> </tr> </table> <table border=2px class="box"> <tr> <td class="name"> <h1>zacchus </h1> </td> <td class="number"> <h2>1</h2> </td> </tr> </table> </div>