title: How to fix the logic problem in my loop for my basic logon screen
body: <p>I get the code to tell me when someone types in a bad userid or password. And I can get it to let people in when the get they type in the first userid and password</p>
  
  <p><code>user1</code> and <code>pass1</code></p>
  
  <p>But, if they try <code>user2</code> and <code>pass2</code> it says it is a wrong password. I know it is a logic error on my part with the loop, but, cant figure it out for the life of me! Please help me understand if you guys can!</p>
  
  <p>Thank you</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;title&gt;Assignment 1&lt;/title&gt;
  &lt;link rel="stylesheet" type="text/css" href="css/login.css"&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;script&gt;
      document.body.style.backgroundColor = "grey";
      var valid = false;
  
      function validate() {
          var useArray = ["user1", "user2", "user3"];
          var passArray = ["pass1", "pass2", "pass3"];
  
          var x = document.login.userId.value;
          var y = document.login.passWord.value;
  
          for(var i = 0; i &lt; useArray.length; i++) {
              if (x == useArray[i] &amp;&amp; y == passArray[i]) {
                  document.write("You have successfully logged on to your 
  class!");
                  return false;
              } else if (i = useArray.length - 1) {
                  document.write("Error: User Id is not valid, please click the 
      link below again \n \n");
                  var l =(" link back");
                  var back = l.link("practice.html");
                  document.write(back);
                  return false;
              }
          }
      }
  &lt;/script&gt;
  &lt;div class="container"&gt;
      &lt;h1&gt;Logon&lt;/h1&gt;
      &lt;form name="login"&gt;
          &lt;label for="useId"&gt;Userid: &lt;/label&gt;    
          &lt;input type="text" name="userId" required&gt;
          &lt;br&gt;&lt;br&gt;
          &lt;label for="passWord"&gt;Password: &lt;/label&gt;
          &lt;input type="password" name="passWord" required&gt;
          &lt;br&gt;&lt;br&gt;
          &lt;input type="button" class="submit" value="Log In" name="submit" 
    onclick="validate(this.form)"&gt;
    &lt;/form&gt;
    &lt;/div&gt;
    &lt;br&gt;&lt;br&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I need it to accept the other parts of the Array too. When someone puts in <code>usee2</code> and <code>pass2</code> for example</p>
  
  <p>Thank you</p>