如何控制显示和隐藏？

我做了2个表单，一个显示，一个隐藏。当我点击更多的时候，显示隐藏的表单tab1，隐藏tab2.
但具体操作的时候，隐藏的tab1显示了，但tab2也是显示的，没被隐藏。想问下我是哪写错了啊？
<table>
<tr>
<table id="tab1" style="display:none;">
代码
</table>
</tr>
<tr>
<table id="tab2">
代码
</table>
</tr>
<input type="button" οnclick="display()" value="显示更多"/>
</table>

<script language=javascript>
function display(){
var obj1=document.getElementById("tab1");
var obj2=document.getElementById("tab2");

if(obj1.style.display=="none"){
obj1.style.display="";
obj2.style.diaplay="none";
}else{
obj1.style.display="none";
obj2.style.diaplay="";
}
}
</script>