JS 동적 추가 삭제 테이블

<script type="text/javascript">
		// 
		var i=0;
		// 
		function addMyRow(){
			var mytable = document.getElementById("mybody");
			var mytr = mytable.insertRow();
			mytr.setAttribute("id","tr"+i);
			var mytd_1=mytr.insertCell();
			var mytd_2=mytr.insertCell();
			var mytd_3=mytr.insertCell();
			var mytd_4=mytr.insertCell();
			var mytd_5=mytr.insertCell();
			mytd_1.innerHTML="<input type='text' name='myname"+i+"'/>";
			mytd_2.innerHTML="<input type='radio' name='mysex"+i+"' value='1'/> <input type='radio' name='mysex"+i+"' value='2'/> ";
			mytd_3.innerHTML="<input type='checkbox' name='mylove"+i+"' value='1'/> <input type='checkbox' name='mylove"+i+"' value='2'/> <input type='checkbox' name='mylove"+i+"' value='3'/> ";
			mytd_4.innerHTML="<select name='myjg"+i+"'><option value='1'> </option><option value='2'> </option><option value='3'> </option></select>";
			mytd_5.innerHTML="<input type='button' value=' ' onclick=\"delMyRow('"+i+"')\"/>";
			i++;
		}
		// 
		function delMyRow(j){
			var mytable = document.getElementById("mybody");
			var myrow = document.getElementById("tr"+j);
			mytable.deleteRow(myrow.rowIndex-1);
		}
		// 
		function delAllMyRow(){
			var mytable = document.getElementById("mybody");
			var rowlen=mytable.rows.length;
			for(var i=rowlen-1;i>=0;i--){
				mytable.deleteRow(i);
			}
		}
		</script>

<input type="button" value=" " onclick="addMyRow();"><input type="button" value=" " onclick="delAllMyRow();">
		<table border="1">
			<thead>
				<tr bgcolor="red">
					<td align="center">
						 
					</td>
					<td align="center">
						 
					</td>
					<td align="center">
						 
					</td>
					<td align="center">
						 
					</td>
					<td align="center">
						 
					</td>
				</tr>
			</thead>
			<tbody id="mybody">
			
			</tbody>
		</table>