使用JavaScript的createElement创建新的元素出现了问题

<script type="text/javascript">
var count=5;
function add()
{
var tr= document.createElement('tr');//创建行

var table = document.getElementById('tb');//获得table对象

table.appendChild(tr);//行加到table
var td1=document.createElement('td');//创建三个td然后加到行里
var td2=document.createElement('td');
var td3=document.createElement('td');
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
var sele1=document.createElement('select');//创建select放到td里
var str1="what"+count.toString();
sele1.setAttribute("name",str1);


var sele2=document.createElement('select');
var str2="how"+count.toString();
sele2.setAttribute("name",str2);

var inp=document.createElement('input');
var str3="content"+count.toString();
inp.setAttribute("name", str3);


td1.appendChild(sele1);
td2.appendChild(sele2);
td3.appendChild(inp);



for(var j=0;j<46;j++)//给第一个select放置46个我想要的option
{
var opt=document.createElement('option');
var strh="hide"+i.toString();
var hidden=document.getElementById(strh).value;


opt.setAttribute("value", hidden);
opt.setAttribute("text",hidden);
sele1.appendChild(opt);
}

var front="front"+count.toString();
var same="same"+count.toString();
var any="any"+cout.toString();
var opt1=document.createElement('option');//下面三个option是给第二个select的
opt1.setAttribute("value", front);
opt1.serAttribute("text","前方一致");

var opt2=document.createElement('option');
opt2.setAttribute("value", same);
opt2.serAttribute("text","完全匹配");


var opt3=document.createElement('option');
opt3.setAttribute("value", any);
opt3.serAttribute("text","任意匹配");



count=count+1;
}


</script>




-----------------------------------
我用了一个button的onclick事件触发上面的js函数，但是点击之后我要创建的那几个元素还没来得及闪一下，页面就自己刷新了，我创建的元素就没了，有哪位知道是怎么回事吗