Usunąć wszystkie węzły podrzędne od rodzica?

Mam listę, chcę tylko usunąć z niej wszystkie węzły potomne. Jaki jest najskuteczniejszy sposób korzystania z jquery? Oto co mam:

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

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

czy istnieje skrót, zamiast usuwać każdą pozycję pojedynczo?

----------- Edytować ----------------

Każdy element listy ma dołączone dane i moduł obsługi kliknięć, taki jak ten:

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

w końcu mógłbym dodać przyciski również do każdego elementu listy - więc wygląda na to, że pusty () jest drogą do zrobienia, aby upewnić się, że nie ma wycieków pamięci?

Można użyć .empty(), podobnie jak to :

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

Z dokumentów :

Usuń wszystkie węzły potomne zestawu dopasowanych elementów z DOM.

Inni użytkownicy zasugerowali,

.empty()

jest wystarczająco dobry, ponieważ usuwa wszystkie węzły potomne (zarówno węzły znaczników, jak i węzły tekstowe) ORAZ wszelkiego rodzaju dane przechowywane w tych węzłach. Zobacz pustą dokumentację interfejsu API JQuery .

Jeśli chcesz zachować dane, takie jak na przykład programy obsługi zdarzeń, powinieneś użyć

.detach()

zgodnie z opisem w dokumentacji odłączania interfejsu API JQuery .

Metoda .remove () może być przydatna do podobnych celów.