jquery - 如何使用jQuery更改HTML元素的位置

我有以下HTML：

<div id="ServiceProvider" class="main_filter" name="filterDiv">
    <div class="filter_chkbox_div" style="display:none">
       <label class="ATT">AT&amp;T</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">
       <label class="CABLEONE">Cable One</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">
       <label class="CABLEONEv6">Cable Onev6</label>
    </div>
    <div class="filter_chkbox_div" style="display:none">
        <label class="CHARTER">Charter</label>
    </div>
</div>

在运行时，我仅显示在数组providerCodes中收到的那些标签

jQuery代码

for (var i = 0; i < providerCodes.length; i++) {
    var providerCheckBox = $("#" + providerCodes[i]);
    if (providerCheckBox.length > 0) {
        $(providerCheckBox).parent().show();
    }
}

现在，我要根据在providerCodes中收到的顺序放置这些标签。例如，如果providerCodes数组在第0个索引中包含CHARTER并且在第一个索引中包含CABLEONE，我想相应地更改这些标签的位置。当前，它将首先显示CABLEONE，然后显示CHARTER。如何在jQuery中做到这一点？

最佳答案

我会这样做（前提是您具有容器的div选择器）：

var containerSelector = $("<container-selector>");
for (var i = 0; i < providerCodes.length; i++) {
   var providerCheckBox = $("#" + providerCodes[i]);
   if (providerCheckBox.length > 0) {
       $(providerCheckBox).parent().show().detach().appendTo(containerSelector);
   }
}