在jQuery下如何删除任意一个节点后，对节点的序号重新排序

说明在先本人小白，想问问大神们如何在一个列表中删除任意节点li，删除后怎样才能对列表中节点的序号进行重新排序。
目前的问题就是删除一个节点li后，再添加节点时序号依然按照原先的顺序排序

//添加投票选项
var num = $("ul > li").length +1
$(".vote-add-btn").click(function() {
    $(this).before("<li class='wx-form-group'><label for='artName' class='sr-only'>选项</label><input type='text' class='wx-form-control' id='artName' placeholder='填写投票选项" + num + "'><span class='del-item'><i class='fa fa-trash-o'></i></span></li>");
    num++;
  //删除投票选项
    var $btnDel = $(".wx-form-group > .del-item");
    $btnDel.click(function(){
        $(this).parent().remove();
});

jq确实蛋疼

javascript<!DOCTYPE html>
<html>
<head>
<title>测试</title>
<script src="jquery.js"></script>
</head>
<body>
<div class="wx-form-group">
<ul>
<li class="vote-add-btn">add</li>
</ul>
</div>
<script>
$(".vote-add-btn").click(function() {
    var num = $("ul > li").length;
    $(this).before("<li class='wx-form-group'><label for='artName' class='sr-only'>选项</label><input type='text' class='wx-form-control' id='artName' placeholder='填写投票选项" + num + "'><span class='del-item'><i class='fa fa-trash-o'>del</i></span></li>");
    $(".wx-form-group > .del-item").click(function(){
        $(this).parent().remove();
        for(i=$(this).index()-1;i<num;i++){
            newnum = i+1;
            $("ul > li").eq(i).find("input").attr("placeholder","填写投票选项"+newnum);
        }
    });
});
</script>
</body>
</html>

类似这种删除某些 li 然后重新排序的工作用 angularJs 之类的 MVC 框架更合适，用 jq 会很蛋疼。
数据和DOM双向绑定，直接操作数组中的数据，页面跟着变，非常happy。

用一个for循环可以解决的，，今天早上刚做了个和你需求差不多的

$('#single-delete-button').click(function(){
$(this).parent().remove();
var singles = $('#single-answer-null > div').length; // 获得剩余单选题数量
for(var i = 0; i < singles; i++){
$('#single-answer-null > div').eq(i).find('span').html(i+1); // 设置编号
}
});

不过我这个性能不是很好，，最好能只是重排被删的后面的几个

【热门文章】