如何使用JQuery替换<ul>的所有<li>元素？

Question

如何在JQuery中替换li的所有ul，我不想使用append将新项添加到列表中，而是想要一个新列表新li个元素位于同一个ul中。

我试过了

for (index = 0; index < users.length; ++index) {
$('#users').replaceChild(users[index].UserName, $('#users').childNodes[index]);
}

HTML

<div class="col-md-4" style="margin:auto">
    <h2 class="text-success">Users</h2>
    <ul id="users" style="list-style:none"></ul>
</div>

但它只将数组的最后一个元素添加到ul 每当我有新列表时，如何创建新的ul？

Answer 1

如果你包含一个数组的例子会更好。我做了一个片段，希望它有所帮助。

var array = ["New li 1", "New li 2", "New li 3"];

$('#load').click(function(){

  $('#list').empty();
  $.each(array, function( key, value ) {
    $('#list').append('<li>' + value + '</li>');
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul id="list">
  <li>Old li 1</li>
  <li>Old li 2</li>
  <li>Old li 3</li>
</ul>

<button id="load">Load array</button>

Answer 2

您可以使用jQuery .replaceWith()函数。

只需使用以下代码

即可

$('#users').replaceWith( "<li>New Item</li>" );

Refer this article。