Innerhtml Validation for a Form

Screenshot:
                       

index.php:

<form name="form1" method="post" onsubmit="return validation();">
<table width="30%" border="0" cellspacing="0" cellpadding="5" id="tbl">
  <tr>
    <td width="226" scope="col"><label for="first3">Firstname</label></td>
    <td width="248" scope="col"><input type="text" name="first" id="first3" /></td>
   <td width="30%" id="fname"></td>
  </tr>
  <tr>
    <td width="226" scope="col"><label for="last"> Lastname</label></td>
    <td width="248" scope="col">  <input type="text" name="last" id="last" /></td>
    <td width="30%" id="lname"></td>
  </tr>
  <tr>
    <td align="center" colspan="2"><input type="submit" name="submit" id="submit" value="Submit" /> </td>
    <td>&nbsp;</td>
  </tr>
</table>
</form>

validation.js:

function validation()
{

var nae=document.form1.first.value;
    if(nae=="" || nae=="null") 
    {
        document.getElementById('fname').innerHTML="Enter Firstname";
        document.getElementById('lname').innerHTML="";
        
        document.form1.first.focus();
        return false;
    }
    
    var nme=document.form1.last.value;
    if(nme=="" || nme=="null") 
    { 
        document.getElementById('fname').innerHTML="";
        document.getElementById('lname').innerHTML="Enter Lastname";
        
        document.form1.last.focus();
        return false;
    }
}