How can I remove HTML elements inside a UL using jQuery?

Question

I have the following HTML code:

<ul class="message" id="stats-results">
   <li>DS1 Records: <span id="ds1Count"></span></li>
   <li>DEV Records: <span id="devCount"></span></li>
</ul>

Is there an easy way for me to completely remove the li elements from the ul using jQuery?

Answer 1

There a method just for that, empty()

$('#stats-results').empty();

Description: Remove all child nodes of the set of matched elements from the DOM.

No need for "tricks".

Answer 2

$("#stats-results").html("");

这将删除所有li元素

Answer 3

尝试$('ul.message li').remove();