从父级删除所有子级节点？

我有一个列表，我只想从中删除所有子节点。使用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（），以确保没有内存泄漏？

您可以.empty()像这样使用：

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

从文档：

从DOM中删除匹配元素集的所有子节点。

其他用户建议，

.empty()

足够好，因为它删除了所有后代节点（标记节点和文本节点）以及存储在这些节点内部的所有数据。请参阅JQuery的API空文档。

如果您希望保留数据（例如事件处理程序），则应使用

.detach()

如JQuery的API分离文档中所述。

方法.remove（）对于类似目的可能是有用的。