Untitled

<!DOCTYPE html>
<html>
<head>
 <style>
 li {list-style-type:none;}
 </style>
</head>
<body>
<center>
<h1 style="color: blue;">
 ODD-EVEN
 </h1>
 ___________________________________________

 <p>Identifier & Counter

 </p>

 <tr> <td> <br/> </td> </tr>

 <table>
<tr>
 <td>Enter 1st # </td>
 <td> <input type="text" id="t1"/> </td>
</tr>

<tr> <td> <br/> </td> </tr>

<tr>
 <td>Enter 2nd # </td>
 <td> <input type="text" id="t2"/>  </td>
</tr>

<tr> <td> <br/> </td> </tr>

<tr>
 <td>Enter 3rd # </td>
 <td> <input type="text" id="t3"/>  </td>
</tr>

<tr> <td> <br/> </td> </tr>

<tr>
 <td>Enter 4th # </td>
 <td> <input type="text" id="t4"/>  </td>
</tr>

<tr> <td> <br/> </td> </tr>

<tr>
 <td>Enter 5th # </td>
 <td> <input type="text" id="t5"/>  </td>
</tr>


</table>
<br/>
<br/>
<br/>

<input type="button" onclick="process()" value="PROCESS"/>
<br/>
 ___________________________________________

<br/>
<br/>
<br/>


	<h1 style="color: blue;"> RESULTS</h1>
	<hr/>

<table border="2px">
  <tr>
   <th> <br/> </th>
   <th> COUNT </th>
   <th> LIST </th>
  </tr>

    <tr>
   <th> ODD </th>
   <td> <p id="odd"> </p> </td>
   <td>
   <ul>
    <li id="od1"> </li>
	<li id="od2"> </li>
	<li id="od3"> </li>
	<li id="od4"> </li>
	<li id="od5"> </li>
	</ul> </td>
  </tr>

    <tr>
   <th> EVEN </th>
   <td> <p id="even"> </p> </td>
   <td>
   <ul>
    <li id="ev1"> </li>
	<li id="ev2"> </li>
	<li id="ev3"> </li>
	<li id="ev4"> </li>
	<li id="ev5"> </li>
	</ul>
   </td>
  </tr>


</table>
</center>

 <script>
  function process() {
  var 1 = document.getElementByID('t1').value;
  var 2 = document.getElementByID('t2').value;
  var 3 = document.getElementByID('t3').value;
  var 4 = document.getElementByID('t4').value;
  var 5 = document.getElementByID('t5').value;

   document.getElementById('')
  }
}


 </script>
</body>

</html>