使用DOM在DOM上移动带有Div的A标签

Question

下面我有四个标签，然后连续下面的一个div。

<a href = "#community"> </a>
<div id = "community-container"></div>

<a href = "#gallery"> </a>
<div id = "gallery-container"></div>

<a href = "#homes"> </a>
<div id = "homes-container"></div>

<a href = "#customer"> </a>
<div id = "customer-container"></div>

我希望能够使用DOM移动带有匹配/适当div的a标签 比如

<a href = "#homes"> </a>
<div id = "homes-container"></div>

<a href = "#customer"> </a>
<div id = "customer-container"></div>

<a href = "#community"> </a>
<div id = "community-container"></div>

<a href = "#gallery"> </a>
<div id = "gallery-container"></div>

我的想法是将每个div的属性设置为A1，D1 C1 ......然后使用for循环首先更改div的顺序

$div_order = "A1C1G1B1E1D1H1";

for($i = 0; $i < $div_order.length; $i++){
$element = $div_order[$i];
$_temp = $($element); //Temporarily save the element
$($element).remove(); //Remove the element
$("#tab-cont-opt").append($_temp); //Reinsert the element in the correct 
order
$("#tab-cont-opt").append(" "); //Space
}

然后使用insertbefore（）函数将之前的标签添加到相应的div ...

这不起作用...... 如果你有任何其他想法，请等一下！