Question

I got this code to sort an unordered list with regards to their title attribute in place.

$('#list li').sort(function(a,b) {
    return $(a).attr('title') < $(b).attr('title');
}).appendTo('#list');

It works great on Firefox and IE but it fails on Chrome as soon as the list element count exceeds 10 (see http://jsbin.com/atoput/4)

Is there a better/easier/faster way of sorting the elements on the fly and do you maybe even have an explanation of what Chrome is doing here?

Answer 1

Use this:

$(document).ready(function() {
  var list  = $('#list');
  var items = list.children('li').get();
  items.sort(function(a, b) {
    var A = a.title;
    var B = b.title;
    return (A < B) ? -1 : (A > B) ? 1 : 0;
  });
  $.each(items, function(idx, itm) { list.append(itm); });
});

Preview can be seen here.

If you want the list to sort based on a descending order, switch around the signs:

return (A > B) ? -1 : (A < B) ? 1 : 0;