Span text not visible
<p>My <strong>HTML</strong> code for signup form:</p>

<pre><code>&lt;html&gt;  
&lt;body&gt;
&lt;form class="form1"  method="post"  onsubmit="return validation()"&gt;


        &lt;table id="ulogin" cellspacing="2"  &gt;       
          &lt;tr&gt;
            &lt;td&gt;Roll : &lt;/td&gt;
            &lt;td&gt;&lt;select name="roll" id="roll" onfocus="setRoll()" onchange="setRoll()" &gt;
                &lt;option value="Staff"&gt;Staff&lt;/option&gt;
                &lt;option value="Student"&gt;Student&lt;/option&gt;                
                &lt;/select&gt;&lt;/td&gt;

          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td style="border:none" id="reg"&gt;&lt;/td&gt;
            &lt;td&gt;&lt;Input type="text" id="regText" name="regText"/&gt;&lt;/td&gt;
            &lt;td&gt;&lt;span id="regs" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;

          &lt;tr&gt;
            &lt;td&gt;Name&lt;/td&gt;
            &lt;td&gt;&lt;Input type="text" id="name" name="name" /&gt;&lt;/td&gt;
            &lt;td&gt;&lt;span id="names" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;Username&lt;/td&gt;
            &lt;td&gt;&lt;Input type="text" id="uname" name="uname"/&gt;&lt;/td&gt;&lt;td&gt;&lt;span id="unames" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;Password&lt;/td&gt;
            &lt;td&gt;&lt;Input type="password" id="password1" name="password"/&gt;&lt;/td&gt;&lt;td&gt;&lt;span id="pwds" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;Confirm password&lt;/td&gt;
            &lt;td&gt;&lt;Input type="password" id="password2"/&gt;&lt;/td&gt;&lt;td&gt;&lt;span id="cpwds"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
            &lt;td&gt;Email&lt;/td&gt;
            &lt;td&gt;&lt;Input type="text" id="email" name="email"/&gt;&lt;/td&gt;
            &lt;td&gt;&lt;span id="emails" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td&gt;Phone No.&lt;/td&gt;
            &lt;td&gt;&lt;Input type="text" id="phone_no" name="phone_no" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
           &lt;td&gt;DOB:&lt;/td&gt;&lt;td&gt; &lt;input type="text" id="dob" name="dob" /&gt;&lt;/td&gt;&lt;td style="font-size:11px"&gt;ex: 07/22/1988&amp;nbsp;&lt;span id="dobs" style="font-size:14px"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
           &lt;td&gt;Gender : &lt;/td&gt;
           &lt;td colspan="2"&gt;          
               &lt;label for="number0"&gt;&lt;input type="radio" value="male" name="gender" &gt; Male&lt;/label&gt;
                &amp;nbsp;&lt;label for="number1"&gt;&lt;input type="radio" value="female" name="gender"&gt; Female&lt;/label&gt;

           &lt;/td&gt;&lt;td&gt;&lt;span id="genders" style="color:#FF0000"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
            &lt;td id="course" &gt;&lt;/td&gt;
            &lt;td id="courseoption" style="visibility:hidden"&gt;&lt;select name="course"&gt;
                &lt;option value="1" selected&gt;DOT NET&lt;/option&gt; 
                &lt;option value="2"&gt;HW/NW&lt;/option&gt;
                &lt;option value="3"&gt;TESTING&lt;/option&gt;
                &lt;option value="4"&gt;PHP/LAMP&lt;/option&gt;
                &lt;option value="5"&gt;JAVA&lt;/option&gt;         
            &lt;/select&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;   

          &lt;tr&gt;&lt;td id="button" align="center" colspan="2" &gt;&lt;input type="submit"  class="button" value="Sign Up" onclick="validation()"/&gt;&lt;/td&gt;&lt;/tr&gt;
      &lt;/table&gt;  


&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p><strong>JavaScript</strong> for validation:</p>

<pre><code>function validation()
  {
      var flag=true;

      var error=new Array();
      var reg=document.getElementById("regText");
      var regspan=document.getElementById("regs");
      var re=/^[0-9]{10}$/;

        //regspan.innerHTML="";


    if(reg.value=="")
    {
        //regspan.innerHTML="Identification no. should not be blank!";
        error[0]="Identification no. should not be blank!";
        flag=false;
        }
        else{error[0]="";}
    if(!re.test(reg.value))
    {
        //regspan.innerHTML
        error[0]="Invalid Identification number!";
        flag=false;
        }
        else{error[0]="";}

//------------------------------------------------------------------------------------------------------    
    var name1=document.getElementById("name");      
    var namespan=document.getElementById("names");  
    var re = /^[A-Za-z ]+$/;    

        //namespan.innerHTML="";

    if(name1.value=="") 
    {     
      //namespan
      error[1]="Name Cannot be blank!";
      flag=false;
    }
    else{error[1]="";}
    if(!re.test(name1.value)) 
    {
      //namespan
      error[1]="Name should contain only alphabets and Space";
      flag=false;
    }
    else{error[1]="";}

//------------------------------------------------------------------------------------------------------    

    var userName=document.getElementById("uname");
    var unamespan=document.getElementById("unames");
    var re = /^[A-Za-z?.? ?@ ]+$/;  

        //namespan.innerHTML="";

    if(userName.value=="") 
    {
      //unamespan
      error[2]="Username cannot be blank!";
      flag=false;
    }
    else{error[2]="";}
    if(!re.test(userName.value)) 
    {
      //unamespan
      error[2]="UserName should contain only alphabets,'.','@'and Space";
      flag=false;
    }
   else{error[2]="";}

//------------------------------------------------------------------------------------------------------    

    var pwd1=document.getElementById("password1");

    var pwd2=document.getElementById("password2");
    var pwdspan=document.getElementById("pwds");

    var re = /[^a-zA-Z0-9\w{6,10}]*/ ;

    if(pwd1.value!="" &amp;&amp; pwd1.value==pwd2.value) 
    {
      pwdspan.innerHTML="";
      if(!re.test(pwd1.value)) 
      {
          //pwdspan.innerHTML
          error[3]="Password should not contain space";
          flag=false;
      }
      else{error[3]="";}
    }

    else
    {
        //pwdspan.innerHTML
        error[3]="Invalid Password";
        flag=false;
        }

//------------------------------------------------------------------------------------------------------    

    var objDate,mSeconds, day,month,year;     
    var dob=document.getElementById("dob").value;
    var dobspan=document.getElementById("dobs");


    if (dob.length !== 10) 
    { 
        //document.getElementById("dobs").innerHTML
        error[4]="Invalid Date";
        flag=false; 
    } else{error[4]="";}

    if (dob.substring(2, 3) !== '/' || dob.substring(5, 6) !== '/') 
    { 
        //document.getElementById("dobs").innerHTML
        error[4]="Invalid Date";
        flag=false; 
    } 
    else{error[4]="";}
    month = dob.substring(0, 2) - 1; 
    day = dob.substring(3, 5) - 0; 
    year = dob.substring(6, 10) - 0; 

    if (year &lt; 1000 || year &gt; 3000) 
    { 
        //document.getElementById("dobs").innerHTML
        error[4]="Invalid Date";
        flag=false; 
    } 
    else{error[4]="";}

    mSeconds = (new Date(year, month, day)).getTime(); 

    objDate = new Date(); 
    objDate.setTime(mSeconds); 

    if (objDate.getFullYear() !== year || objDate.getMonth() !== month || objDate.getDate() !== day) 
    { 
        //document.getElementById("dobs").innerHTML
        error[4]="Invalid Date";
        flag=false; 
    } 
    else{error[4]="";}

//------------------------------------------------------------------------------------------------------    

    var email=document.getElementById("email");
    var emailspan=document.getElementById("emails");

        //emailspan.innerHTML="";

    var re=/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
    if(email.value=="")
    {
        //emailspan.innerHTML
        error[5]="Email Id should not be blank";
        flag=false;
        }
        else{error[5]="";}
    if(!re.test(email.value))
    {
        //emailspan.innerHTML=
        error[5]="Invalid Email Id!";
        flag=false;
    }
    else{error[5]="";}

//------------------------------------------------------------------------------------------------------    

    var gender1=document.getElementByName("gender");

        for (var i=0; i &lt; gender1.length; i++)
           {
           if (gender1[i].checked)
              {
              var rad_val = gender1[i].value;
              }
           }
    if(rad_val=="")
    {
        //document.getElementById("genders").innerHTML
        error[6]="Choose a gender!";
        flag=false;
        }
        else{error[6]="";}

//------------------------------------------------------------------------------------------------------    

    `if(flag==flase)
    {
        regspan.innerHTML=error[0];
        namespan.innerHTML=error[1];
        unamespan.innerHTML=error[2];
        pwdspan.innerHTML=error[3];
        dobspan.innerHTML=error[4];
        emailspan.innerHTML=error[5];
        document.getElementById("genders").innerHTML=error[6];

    }`
</code></pre>

<p>this portion is not working and showing the span value. What is the error?
        <code>return flag;
    }</code></p>

<pre><code> //______________________________________________________________________________________________________________
function setRoll()
   {
        var roll=document.getElementById("roll");
        var course=document.getElementById("course");

            course.innerHTMl=="";
            document.getElementById("courseoption").style.visibility="hidden";

             if(roll.options[roll.selectedIndex].text=="Staff")
            {
                    document.getElementById("reg").innerHTML= "Employee ID. :";
                    document.getElementById("course").innerHTML= "";

                }
                else
                {
                    document.getElementById("courseoption").style.visibility="visible";
                    document.getElementById("reg").innerHTML= "Registration No. :";
                    document.getElementById("course").innerHTML= "Course. :";
                    }
        return true;
  }
</code></pre>

<p>Why this function is not validating and showing the span value? I was doing validation for all field at same time. Help me with validation.</p>
