Xóa tất cả các nút con khỏi nút cha?

Tôi có một danh sách, tôi chỉ muốn xóa tất cả các nút con khỏi nó. Cách sử dụng jquery hiệu quả nhất là gì? Đây là những gì tôi có:

<ul id='foo'>
  <li>a</li>
  <li>b</li>
</ul>

var thelist = document.getElementById("foo");   
while (thelist.hasChildNodes()){
    thelist.removeChild(thelist.lastChild);
}

Có một lối tắt thay vì xóa từng mục, từng mục một?

----------- Biên tập ----------------

Mỗi phần tử danh sách có một số dữ liệu được đính kèm với nó và một trình xử lý nhấp chuột như sau:

$('#foo').delegate('li', 'click', function() {
    alert('hi!');
});

// adds element to the list at runtime
function addListElement() {
    var element = $('<li>hi</hi>');
    element.data('grade', new Grade());
}

cuối cùng tôi cũng có thể thêm các nút cho mỗi mục danh sách - vì vậy có vẻ như trống () là cách để thực hiện, để đảm bảo không có rò rỉ bộ nhớ?

Bạn có thể sử dụng .empty(), như thế này :

$("#foo").empty();

Từ các tài liệu :

Xóa tất cả các nút con của tập hợp các phần tử đã so khớp khỏi DOM.

Một người dùng khác đã đề xuất,

.empty()

là điều nên làm, bởi vì nó loại bỏ tất cả các nút con (cả nút thẻ và nút văn bản) VÀ tất cả các loại dữ liệu được lưu trữ bên trong các nút đó. Xem tài liệu trống về API của JQuery .

Nếu bạn muốn giữ dữ liệu, chẳng hạn như trình xử lý sự kiện, bạn nên sử dụng

.detach()

như được mô tả trên tài liệu tách API của JQuery .

Phương thức .remove () có thể hữu ích cho các mục đích tương tự.