无论长度如何，都将项目添加到列表的末尾

Question

我需要在列表末尾添加一行文字。此列表可以有不同的长度，例如：

<div id="characteristics">
  <ul>
    <li>Words</li>
    <li>More words</li>
  </ul>
</div>

我希望使用JS或JQuery定位此列表中的最后一项，并添加我的新行。

这些的CSS选择器是：

#characteristics ul
#characterisitcs ul li

Answer 1

jQuery＆＃39; s append()在元素的末尾添加了HTML。这应该有效：

$('#characteristics ul').append('<li>Another item</li>');

Answer 2

尝试$('#characteristics > ul').append()。

var lastLI = $('#characteristics > ul').append('<li>More words words</li>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="characteristics">
  <ul>
    <li>Words</li>
    <li>More words</li>
  </ul>
</div>

Answer 3

以下将在ul

末尾添加新的li

$("#characteristics ul").append('<li> Your New item</li>');

Answer 4

替代解决方案是将last-child与after一起使用。或者附加我已经在问题评论中提到的工作。

＆＃13;

＆＃13;

$('ul li:last-child').after('<li>More words1</li>');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="characteristics">
  <ul>
    <li>Words</li>
    <li>More words</li>
  </ul>
</div>

＆＃13;

＆＃13;

＆＃13;