Jquery 重新排列z索引

我有这样安排的部门：

<div id='div1' style='z-index:50'>1<div>
<div id='div2' style='z-index:200'>2<div>
<div id='div3' style='z-index:60'>3<div>
<div id='div4' style='z-index:100'>4<div>

<div id='div1' style='z-index:1'>1<div>
<div id='div2' style='z-index:4'>2<div>
<div id='div3' style='z-index:2'>3<div>
<div id='div4' style='z-index:3'>4<div>

1
2.
3.
4.

我打算用jquery重新排列z索引，如下所示：

<div id='div1' style='z-index:50'>1<div>
<div id='div2' style='z-index:200'>2<div>
<div id='div3' style='z-index:60'>3<div>
<div id='div4' style='z-index:100'>4<div>

<div id='div1' style='z-index:1'>1<div>
<div id='div2' style='z-index:4'>2<div>
<div id='div3' style='z-index:2'>3<div>
<div id='div4' style='z-index:3'>4<div>

1
2.
3.
4.

有人知道我该怎么做吗

表示感谢

---

yoav

您通常可以使用jQuery的

.css（）函数，但由于您的样式直接位于HTML中，因此不会覆盖它。您可以使用
.attr（）
：

例如：

$('#div1').attr('style','z-index:1');

如果需要，您可以这样做4次，然后输入您自己的值。
您可以通过获取元素、按z索引对集合进行排序，然后迭代并使用索引设置新的z索引来完成此操作。这不会影响元素在DOM中的位置，我们只是重新排列集合

$('[id^="div"]').sort(function(a, b) {
    return a.style.zIndex - b.style.zIndex;
}).css('z-index', function(i) {return i+1;});


请注意，您必须关闭DIV元素才能使其工作
，您尝试了什么？我不太确定您想要实现什么。从外观上看，您仍然显示了介于1和2之间的div3和div4为什么不设置相关的z索引呢？你不能把它设置在服务器端吗？这个HTML是如何呈现的？
css（）
覆盖内联样式，实际上，它使用的是内联样式