Untitled

<html>
<head>
<script type="text/javascript">
var counter1 = 1;
var counter2 = 2;
var addingrow = 0;
var numRows = 0;
function insRow()
  {

  var x=document.getElementById('myTable').insertRow(0);
  var y=x.insertCell(0);
  var z=x.insertCell(1);
 
   
  addingrow += 1;
  numRows = addingrow - 2;
  y.innerHTML=counter1;
  z.innerHTML=counter2;
counter1 += 2;
counter2 += 2;
  var a=document.getElementById('myTable').rows[addingrow].cells
  a[0].innerHTML= counter1;

  var b=document.getElementById('myTable').rows[addingrow].cells
  b[1].innerHTML=counter2;
  }
function changeCell()
  {
  var x = document.getElementById('cellchange').value;
  var y=document.getElementById('myTable').rows[numRows].cells
  y[1].innerHTML=x;
  }

</script>
</head>

<body>
<h1>HW js 2</h1>
<table id="myTable" border="1">

</table>
<br />
<ol>
<li>
<p><a onclick="insRow();">Each click adds a row with a content number in the contents starting with the number 1</a></p>
</li>
<li>
<form id="myForm" name="myForm">set the contents of cell number 4 to: <input id="cellchange" type="text"></form>
<input type="button" onclick="changeCell();" value="Change cell">

</li>
<li>3
</li>
<li>4
</li>
<li>5
</li>
<li>6
</li>
<li>7
</li>
<li>8
</li>
</ol>
</body>
</html>