Jquery - sort DIV's by innerHTML of children

Answer 1

You can sort with jquery by doing

var mylist = $('ul');
var listitems = mylist.children("li");
listitems.sort(function(a, b) {
   var compA = $(a).text().toUpperCase();
   var compB = $(b).text().toUpperCase();
   return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$(mylist).append(listitems);

---

It automaticly sort by price if you do

var mylist = $('#sortThis');
var listitems = mylist.children("div");
listitems.sort(function(a, b) {
   var compA = $(a).text().toUpperCase();
   var compB = $(b).text().toUpperCase();
    console.log((compA < compB) ? -1 : (compA > compB) ? 1 : 0);
   return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$(mylist).append(listitems);

Ill see if i cant scratch something out with an if :)

---

Got something like:

if(sortorder === 'price') {

    var mylist = $('#sortThis');
    var listitems = mylist.children("div");
    listitems.sort(function(a, b) {
       var compA = $(a).children('.price').text().toUpperCase();
       var compB = $(b).children('.price').text().toUpperCase();
       return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
    })
    $(mylist).append(listitems);

} else if (sortorder === 'style') {

    var mylist = $('#sortThis');
    var listitems = mylist.children("div");
    listitems.sort(function(a, b) {
       var compA = $(a).children('.style').text().toUpperCase();
       var compB = $(b).children('.style').text().toUpperCase();
       return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
    })
    $(mylist).append(listitems);

}