jQuery:对列表项进行排序但保留类

Question

我有一个包含类的列表，例如:

 <ul id="my_list">
    <li class="notrelevant"><a href="#1">something not relevant</a></li>
    <li class="notrelevant"><a href="#2">something not relevant</a></li>
    <li class="notrelevant"><a href="#3">something not relevant</a></li>
    <li class="notrelevant"><a href="#4">something not relevant</a></li>
    <li class="notrelevant"><a href="#5">something not relevant</a></li>


    <li class="relevant"><a href="#75">something not relevant</a></li>
</ul>

你可以看到列表的最后一个类是相关的，并且这个类应该始终位于列表的末尾!

我尝试用以下方法随机排序列表:

$(document).ready(function(){
    var liArr =[]

    $('ul').each(function(){
        var $ul = $(this);
        liArr = $ul.children('li');
     });    
    var i = liArr.length,
        j, temp;
    while (--i) {
        j = Math.floor(Math.random() * (i + 1));
        temp = liArr[i];
        liArr[i] = liArr[j];
        liArr[j] = temp;
    };
$('ul').append(liArr);            
});

ofc 则处于中间位置。我不想忽略最后一项，所有标签都必须随机排序。

我如何随机排序列表并仅将最后一个类别设置为“相关”，或者我可以仅订购标签吗？

Answer 1

var $list = $('#my_list'), 
    $li = $list.find('li:not(:last)');
$li.sort(function(){
   return Math.floor(Math.random() * 3);
}).prependTo($list);

http://jsfiddle.net/Sa6GG/

或者:

var $list = $('#my_list'), 
    $li = $list.find('li');

$li.sort(function(){
   return Math.floor(Math.random() * 3);
});

$li.prop('class', 'notrelevant')
   .last()
   .prop('class', 'relevant')
   .end()
   .appendTo($list);

http://jsfiddle.net/MQYA3/