Javascript 根据id名称重新排列div顺序

我有下面的HTML，它通过jQuery显示，它是一个用户列表-但我试图找到一种方法来指定一个id名称，使适当的my_list div移动到顺序的顶部

例如：

<div class="my_list" id="peter"><label class="name">Peter - <div id="peter_status"></div></label></div>
<div class="my_list" id="sam"><label class="name">Sam - <div id="sam_status"></div></label></div>
<div class="my_list" id="derek"><label class="name">Derek - <div id="derek_status"></div></label></div>

彼得- 山姆- 德里克- 如果我指定Sam，则会变成以下内容：

<div class="my_list" id="sam"><label class="name">Sam - <div id="sam_status"></div></label></div>
<div class="my_list" id="peter"><label class="name">Peter - <div id="peter_status"></div></label></div>
<div class="my_list" id="derek"><label class="name">Derek - <div id="derek_status"></div></label></div>

Sam-
彼得-
德里克-

我尝试创建一些代码以提供帮助，如下所示：

$( '<div class="my_list" id="sam">' ).insertBefore($( ".my_list" ).first());

$（“”）.insertBefore（$（“.my_list”）.first（）；

以下是一些相关的答案，可以通过谷歌搜索“javascript重新排列div顺序”找到：

试试这个

请注意，我们需要一个容器，以便您的

div

s进行排序：

<div class="container">
    <div class="my_list" id="peter">
        <label class="name">Peter -
            <div id="peter_status"></div>
        </label>
    </div>
    <div class="my_list" id="sam">
        <label class="name">Sam -
            <div id="sam_status"></div>
        </label>
    </div>
    <div class="my_list" id="derek">
        <label class="name">Derek -
            <div id="derek_status"></div>
        </label>
    </div>
</div>

---

你不需要太多的代码。鉴于您需要排序的每个元素都有自己的id，您可以使用以下代码，简单且可扩展：

var order = ['sam','peter','derek'];
for (var i = 1; i < order.length; i++) {
    $('#'+order[i]).insertAfter('#'+order[i-1]);
}

var顺序=['sam'，'peter'，'derek']；
对于（变量i=1；i

---

这里有一个.

所以只需将具有给定id的元素前置到顶部即可<代码>$（'#sam'）.parent（）.prepend（$（'#sam'））这与其说是一个实际答案，不如说是一个注释。。。为什么不将其标记为其中一个的副本？

var order = ['sam','peter','derek'];
for (var i = 1; i < order.length; i++) {
    $('#'+order[i]).insertAfter('#'+order[i-1]);
}