title: JS->Form validation on inputs. Using for loop to get all the inputs index
body: <p>I have a form with 4 inputs and I want to show an alert on submit. What I have done is that I have already created the warnings that goes under every input with display:none; in CSS.  </p>
  
  <p>After this I have created a for loop in JS to get the index of every input and apply my if statement of showing the the alert if === null || === "" 
  using a variable to make the <code>querySelector("THE CLASS").style.display="block";</code></p>
  
  <p>Also on my form I have this line</p>
  
  <p><code>&lt;form method="post" class="q-form" name="form" onsubmit="return validate()"&gt;</code></p>
  
  <p>My problem is when I submit my form the only alert that is shown is the one under the Username and after it appears it also disappears because I think that the for loop goes to the next input. </p>
  
  <p>Let me know if there is something more to clarify.</p>
  
  <p>Here you have all the code: <a href="https://jsbin.com/kazopahuga/1/edit?html,js,output" rel="nofollow">https://jsbin.com/kazopahuga/1/edit?html,js,output</a></p>
  
  <p>If you want to see the alert showing press Run with JS</p>
  
  <p>Thank You!  </p>