Jquery 如何避免在删除列表的第一个子项时删除所有子项？

HTML:

Blah1

Javascript:

<ul id="ll">
    <li class="ba">Blah1<a id="nex" href="#">Run Test</a></li>
</ul>

$（文档）.ready（函数（）{
$（'ll li'）。追加（'li class=“ba”id=“new”>Blah2
Blah3
Blah4
Blah5
）；
$（'#nex'）。单击（函数（）{
var ne=$（'#nex'）.next（）.html（）；
控制台日志（ne）；
$（'ll:first Child'）.empty（）.append（ne）；
//$（'ll:first Child'）.empty（）.replacetwith（ne）；
});
});
$（文档）。在（'click'，'#dll'，函数（）上{
$（this.parent（）.remove（）；
});

在这段代码中，我想动态地将child添加到列表中，然后在添加元素之后，我想用nextchild替换第一个child，不管当前是什么，通过替换所有child来完成这一操作，所有child都会被删除，只有第二个子项被替换为第一个子项。然后我还想通过单击“删除链接”删除列表中的当前子项

---

页面上不能有重复的

id

属性，并将它们用作选择器。你的意思是用类来代替吗

$（文档）.ready（函数（）{
$（'ll'）
.追加（'li class=“ba”>Blah2
Blah3
Blah4
Blah5
）
.on（'click'，'li a'，function（）{
$（this.parent（）.remove（）；
});
$（'#nex'）。单击（函数（）{
$（this）.parent（）.clone（）.appendTo（'ll'）.children（'a'）.text（'del'）；
返回false；
});
});


Blah1
这里有一个JSFIDLE工作模式

$(document).ready(function() {

    $('#ll li').append('<li class="ba" id="new">Blah2<a id="dll" href="#">del</a></li><li class="ba">Blah3<a id="dll" href="#">del</a></li><li class="bba">Blah4<a id="dll" href="#">del</a></li><li class="bba">Blah5<a id="dll" href="#">del</a></li>');

    $('#nex').click(function() {
        var ne = $('#nex').next().html();
        console.log(ne);
        $('#ll:first-Child').empty().append(ne);

        //$('#ll:first-Child').empty().replaceWith(ne);
    });
});


$(document).on('click', '#dll', function() {
    $(this).parent().remove();
});


Blah1

$（文档）.ready（函数（）{
$（'ll'）。追加（'li class=“ba”id=“new”>Blah2
Blah3
Blah4
Blah5
）；
$（'#nex'）。单击（函数（）{
var$nex=$（本）；
$nex.closest（“li.ba”）.remove（）；
});
$（文档）。在（'单击'，'.dll'，函数（）上{
$（this）.最近的（“li”）.remove（）；
});
});


基本上你有很多错误：


您正在将li添加到另一个li中
您正在使用重复的ID，因此我将它们更改为“dll”类
“运行测试”应该做什么还不是很清楚，基本上，我删除了它
第一组

你需要“运行测试”来做什么？
嗨，现在我想知道你想做什么


$（文档）.ready（函数（）{
$（'ll>li'）。在（'li class=“ba”class=“new”>Blah2
Blah3
Blah4
Blah5
）之后；
$（'.dll'）。在（'click'，function（）上{
$（this.parent（）.remove（）；
});
});
#nex{
字体大小：粗体；
颜色：红色；
}


Blah1
您现在拥有的代码如何不起作用？您基本上希望删除第一个，而不是用第二个替换第一个。将“
”插入到前一个“
”中时，将子节点添加到错误的节点中，这是错误的$（'ll li'）。附加（）。。将此更改为$（'#ll'）。追加
<ul id="ll">
    <li class="ba">Blah1<a id="nex" href="#">Run Test</a></li>
</ul>


$(document).ready(function(){

$('#ll').append('<li class="ba" id="new">Blah2<a class="dll" href="#">del</a></li><li class="ba">Blah3<a class="dll" href="#">del</a></li><li class="bba">Blah4<a class="dll" href="#">del</a></li><li class="bba">Blah5<a class="dll" href="#">del</a></li>');

$('#nex').click(function(){
    var $nex = $(this);
    $nex.closest("li.ba").remove();
});

$(document).on('click','.dll',function(){
      $(this).closest("li").remove();
  });

});