Hi people,

Im having an issue with my array, it instantly shows undefined inputs.
i googled this issue but all i could find is if you were entering your data into a document.write but im using Get.ElementById

i will paste the code below, sorry in advance for it being messy iv been bashing it togethouor.
can someone show me how to get rid of this issue ?

Kind Regards

Adam

Code JavaScript:
<html>
 
  <head>
 
  <title>Football Teams</title>
 
  <script>
 
 
 
  var array = new Array();
  var number =1;
 
 
 
  function insert(val){
 
  	array[array.length]=number+val;
 
  }
 
 
 
  function show() {
 
  	var string="<b>Teams</b><br>";
 
 	 for(i = 0; i <10 ; i++) {
 
  		string =string+array[i]+"<br>";
 
  }
 
  if(array.length > 0)
 
 document.getElementById('myDiv').innerHTML = string;
 
  }
 
  function increase()
  {
  number += 1;
  document.getElementById('number').value=number;
  }
 
  </script>
 
 
 
  </head>
 
 
 
  <body>
 
  <h2>Team Names</h2>
 
  <form name="form1">
 
  <table width="407">
 
  <tr>
 
  <td width="154" align="right"><b>Name</b>
 
  <td width="9"><b>&nbsp;:</b>
 
  <td width="224">
 
  <input type="text" name="name"/>
 
  </tr>
 
  <tr>
 
  <td width="154" align="right">
 
  <td width="9">
 
  <td width="224">
 
  </tr>
 
  <tr>
 
  <td width="154" align="right">
 
  <td width="9">
 
  <td width="224">
 
  <input type="button" Value="Add Team name to Array" 
 
 onclick="insert(this.form.name.value),show(),increase();"/>
 
  </tr>
 
  </table>
 
  </form>
 
  <div id="myDiv"></div>
 
  </body>
 
</html>