javascript dom 中removeChild 的困惑

代码如下： 我想做的是为Node 写一个clearChildren() 的函数，作用就是将它的所有孩子清除，只留自己，以便重新添加新的节点
但是好像效果并不是想像的那样 ，孩子节点一个也没有去掉，alert(d.innerHTML); 依然能显示 出来，请高手讲解
JScript code:
//清空domOBJ 的所有子节点
Node.prototype.clearChildren = function() {
var children = this.childNodes;

for ( var i = 0; i < children.length; i++) {
var child = children[i];

while(child.hasChildNodes()){
child.clearChildren();
}
this.removeChild(child);
}
// alert(this);
// var par=this.parentNode;
// var clone_=this.cloneNode(false);
// par.replaceChild(clone_, this);
return this;
}


function click_action() {
var d = document.getElementById("d");

var tab = document.getElementById("tab");
//d.removeChild(tab);//如果是这样，选获取d.tab 节点(而不是d.childNodes[i]方式)则可以
var d2 = document.getElementById("d2");

d.clearChildren();

alert(d.innerHTML);
d2.appendChild(d);


}



HTML code:

<%@ page language="java" import="java.util.*;" pageEncoding="UTF-8"