title: Keyup is working only after clicking on "submit"
body: <p>I want to apply colors to input field while typing in it, However it is applied only after I click on the button &quot;submit&quot;. I could not paste my code here, so I have attached it.[enter image description here][1]</p>
  <pre><code>`const form=document.querySelector('form');
   const submit=document.querySelector('submit');
   const pattern=/^[a-zA-Z]{6,12}$/;
   const feedback=document.querySelector('.feedback');
  
   form.addEventListener('submit', (e)=&gt;{
   e.preventDefault();
   if(pattern.test(form.username.value)){
      feedback.textContent='Nice :)';
   }else{feedback.textContent='Too Sad :('}
   })
  
   form.username.addEventListener('keyup', (e)=&gt;{
   if(pattern.test(e.target.value)){
      form.username.setAttribute('class', 'success')}
      else{form.username.setAttribute('class', 'error')}
    })`
  </code></pre>