Why does the function validation doesn't get invoked?

I am working on form validation using script. I am a beginner and I couldn't resolve this issue. The form code:

<form id="form"  onsubmit="return validation()" target="_top" action="submission.html">
    <label for="name">Name<span style="color:red;">*</span>:</label>
    <input type="text" id="name" name="name"><br><br>

    <label for="add">Address<span style="color:red;">*</span>:</label>
    <input type="text" id="add" name="address"><br><br>

    <label for="zip">Zip Code<span style="color:red;">*</span>:</label>
    <input type="text" id="zip" name="zip"><br><br>

    <label for="country">Country<span style="color:red;">*</span>:</label>
    <select id="country" name="country">
    <option value="">Please select</option>
    <option value="india">india</option>
    <option value="US">US</option>
    </select><br>
    
    <p>Gender:<span style="color:red;">*</span>
    <input type="radio" id="male" name="gender" value="male">
    <label for="male">Male</label>
    <input type="radio" id="female" name="gender" value="female">
    <label for="female">Female</label>
    </p>

    <p>Preferences:<span style="color:red;">*</span>
    <input type="checkbox" id="colour1" name="red" value="red">
    <label for="colour1">Red</label>
    <input type="checkbox" id="colour2" name="green" value="green">
    <label for="colour2">Green</label>
    <input type="checkbox" id="colour3" name="blue" value="Blue">
    <label for="colour3">Blue</label>
    </p><br>

    <label for="phone">Phone<span style="color:red;">*</span>:</label>
    <input type="phone" id="phone" name="phone"><br><br>

    <label for="email">Email<span style="color:red;">*</span>:</label>
    <input type="email" name="email" id="email"><br><br>

    <label for="pass">Password(6-8 characters)<span style="color:red;">*</span>:</label>
    <input type="text" name="password" id="pass"><br><br>
    <label for="verpass">Verify Password<span style="color:red;">*</span>:</label>
    <input type="text" name="Verfiy Password" id="verpass"><br><br>
    
    <button type="submit" value="Submit">Submit</button>
    <input type="reset" value="Clear">
  </form>

script code:

<script>
    function validation(){
      let zip=document.getElementById("zip").value;

      let email=document.getElementById("email").value;
      let email1=email.slice(-4);
      let index=email.indexof("@");

      let pass=document.getElementById("pass").value;
      let pass1=document.getElementById("verpass").value;

      var form = document.getElementById("form").elements;
         for(var i=0;i<form.length;i++)
         {  
              if(form[i].value=="")
              { 
          alert(form[i].name+" must not be empty");
          return false;
              } 
         }
         if(isNaN(zip))
         {
             alert("Enter a valid zip code");
             return false;
         } else if(email1!=".com"||index==-1)
         {
             alert("Enter a valid email");
             return false;
         } else if(pass.length<6||pass.length>8)
         {
             alert("Enter a valid password");
             return false;
         } else if(pass!=pass1)
         {
             alert("Password doesnt match");
             return false;
         } else
         {
           return true;
         }
} 
</script>

The desired function is on clicking submit button the validation function is invoked and the output is given. But on clicking submit button the validation is not checked according to this code. Could anyone spot the error

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum