Удалить все дочерние узлы из родителя?

У меня есть список, я просто хочу удалить из него все дочерние узлы. Какой самый эффективный способ использования jquery? Это то, что у меня есть:

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

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

есть ли ярлык, а не удаление каждого элемента, по одному?

----------- Изменить ----------------

В каждом элементе списка есть некоторые данные, прикрепленные к нему, и обработчик щелчка следующим образом:

$('#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());
}

В конце концов, я мог бы добавить кнопки в элемент списка тоже - так что это выглядит как empty(), чтобы убедиться, что утечки памяти отсутствуют?

Ответы

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

.empty()

.detach()