jquery分類和順序=）

Question

我遇到的問題是我需要將某些div分組在一起並重新排列它們，如果它是全部動畫，它將很酷。請看下面：

<div id="away">Some Content</div> 
<div id="online">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="away">Some Content</div> 
<div id="online">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="away">Some Content</div> 

所以我親切需要組ID的共同順序是： 1.online 2.away 3.offline

所以：

<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="away">Some Content</div> 
<div id="away">Some Content</div> 
<div id="away">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="offline">Some Content</div> 

我似乎無法讓我的頭圍繞這一個=（。

我在網站的其餘部分使用jquery。

任何想法=），乾杯，山姆牛逼

Answer 1

首先，讓我們擺脫這些ID的（ID必須是唯一的），並使用類有效的HTML，像這樣：

<div id="users"> 
    <div class="away">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="offline">Some Content</div> 
    <div class="away">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="offline">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="away">Some Content</div> 
</div> 

然後，你可以很容易地使用.appendTo()，這樣對它們進行排序：

var statusOrder = ["online", "away", "offline"]; 
for(var i=0; i<statusOrder.length; i++) { 
    $("#users ." + statusOrder[i]).appendTo("#users")​​​​​​​​​​​​​​​​​​​​​​​; 
} 

You can give it a try here，這是假定一個簡單的容器，像<div id="users"></div>解決此內容包裹...只是使用塞萊無論它們在哪個容器中都可以。