Form validation Complete in Javascript

COMPLETE FORM VALIDATION USING JAVASCRIPT

HERE IS THE SOURCE CODE(JUST COPY AND PASTE IN YOUR TEXT EDITOR):

<!DOCTYPE html>
<html lang="en" id="hello">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Test Page</title>
  <link rel="stylesheet" href="latesttest.css">
</head>
<body>
      <form action="" onsubmit=" return validation()">


          USERNAME <input type="text" id="username" placeholder="Username"><br><br>
          <span id="userError" style="color:red;"></span>

          MOBILE NO <input id="mob" type="text" placeholder="MOBILE NUMBER"><br><br>
          <span id="mobError" style="color:red;"></span>


          EMAIL ID <input id="vemail" type="email" placeholder="EMAIL ID" required><br><br>
          <span id="emailError" style="color:rgb(212, 31, 31);"></span>

          PASSWORD <input id="pass" type="password" placeholder="PASSWORD"><br><br>
          <span id="passError" style="color:red;"></span>

          CONF PASS <input id="cpass" type="password" placeholder="CONFIRM PASSWORD"><br><br>
          <span id="cpassError" style="color:red;"></span>

          <button type="submit">SUBMIT</button>

      </form>
<script>

function validation()
{

//TARGETING TO GET THE VALUES ENTERED IN VARIOUS FIELDS 
var a = document.getElementById("username").value;
var n = document.getElementById("mob").value;
var e = document.getElementById("vemail").value;
var b= document.getElementById("pass").value;
var c= document.getElementById("cpass").value;

// USERNAME VALIDATIONS

// NO BLANKS ALLOWED
if(a=="")
{
  document.getElementById('userError').innerHTML="** PLEASE ENTER A VALID USERNAME <br><br>";
  return false;
}

// ONLY NUMBERS ARE NOT ALLOWED IN USERNAME
else if( !isNaN(a) )
{
  document.getElementById('userError').innerHTML="** USERNAMES WITH ONLY NUMBERS IS NOT A VALID USERNAME <br><br>";
  return false;
}

// LENGTH OF USERNAME SHOULD BE 2-20
else if(a.length<2 || a.length>20)
  {
    document.getElementById('userError').innerHTML="** PLEASE ENTER A USERNAME BETWEEN 2 - 20 CHARACTERS ONLY <br><br>";
  return false;
  }

 
 //MOBILE NUMBER VALIDATION 

 //LENGTH SHOULD BE 10
  else if(n.length!=10)
{
  document.getElementById('mobError').innerHTML="** PLEASE ENTER A 10 DIGIT VALID MOBILE NUMBER <br><br>";
  return false;
}

//NUMBER SHOULD NOT INCLUDE CHARACTERS
else if( isNaN(n) )
{
  document.getElementById('mobError').innerHTML="** ONLY NUMBERS ARE ALLOWED IN THIS FIELD <br><br>";
  return false;
}

//PASSWORDS VALIDATION

//PASSWORD SHOULD NOT MATCH
  else if(b!= c){
    document.getElementById("cpassError").innerHTML="** PASSWORD AND CONFIRM PASSWORD DO NOT MATCH <br><br>";
    return false;
  }

  //CONDITION FOR PASSWORD
  else if(b==""||c==""||b.length<6||c.length<6){
    alert("PLEASE ENTER A VALID PASSWORD WITH ATLEAST 6 CHARACTERS, MIN ONE SPECIAL CHARACTER AND A CAPS AND A SMALL LETTER");
    return false;
  }

//EMAIL VALIDATION
else if(( e.indexOf("@")<=1) && (e.lastIndexOf(".")<=1))
{
  document.getElementById("emailError").innerHTML="**PLEASE ENTER A VALID EMAIL ID <br><br>";
  return false;
}

  else{
    alert("successfully submitted!!");
    return true;
  }
 
}


</script>
</div>
</body>
</html>