title: How to validate SSN using regular expressions
body: <p>I have most of my code done for it but for some reason, it is just submitting my form without doing anything. I'm trying to validate an SSN whether they enter it without or with dashes. As well as validating it I want to change the color of the words and background of input if it is invalid. I have my class names and IDs set up correctly and in my CSS I'm using things like <code>input.invalid</code>, <code>label.invalid</code> etc for color changes. here is what I have for my JS code. Any help would be great, thank you!</p>
  <pre><code>    window.onload = function () {
  
  document.forms[0].onsubmit = validForm;
  
      }
  
   function validForm () {
  
  var allTags = document.forms[0].getElementsByTagName(&quot;*&quot;);
  
  for(vari = 0; i &lt; allTags.length; i++) {
      
      validTag(allTags[i]);
      
  }
  
  return false;
  
  function validTag(thisTag) {
      
      var outClass = &quot;&quot;;
      
      var allClasses = thisTag.className.split(&quot; &quot;);
      
      for(var j = 0; j &lt; allClasses.length; j++) {
          
          outClass += validBasedOnClass(allClasses[j]) + &quot; &quot;;
          
      }
      
      thisTag.className = outClass;
      
      if(outClass.indexOf(&quot;invalid&quot;) &gt; -1) {
         
          invalidLabel(thisTag.parentNode);
          
          thisTag.focus();
          
          if(thisTag.nodeName == &quot;INPUT&quot;) {
             
             thisTag.select();
             
          }
         
      }
      
      function validBasedOnClass(thisClass) {
          
          var classBack = &quot;&quot;;
          
          switch(thisClass) {
                  
              case &quot;&quot;:
                  
              case &quot;invalid&quot;:
                  break;
                  
              case &quot;Social&quot;:
                  
                  if(!validSocial(thisTag.value)) {
                     
                      document.getElementById(&quot;socialNum&quot;).className = (&quot;invalid&quot;);
                      
                      document.getElementById(&quot;ssn&quot;).className = (&quot;invalid&quot;);
                      
                     classBack = &quot;invalid &quot;;
                     
              }
                  break;
                  
              default:
                  
                  classBack += thisClass;
                  
          }
          
          return classBack;
          
      }
      
      function validSocial(social) {
          
          var re = /^\d{3}-?\d{2}-?\d{4}$/;
          
          var socialArray = re.test(social);
          
          if(socialArray) {
              
              document.getElementById(&quot;socialNum&quot;).value = socialArray[1] + &quot;-&quot; + socialArray[2] + &quot;-&quot; + socialArray[3];
              
              return true;
             
          }
          
          return false;
          
      }
      
      function invalidLabel(parentTag) {
          
          if(parentTag.nodeName == &quot;LABEL&quot;) {
             
              parentTag.className += &quot;invalid&quot;;
             
             }
          
      }
      
  }
  </code></pre>
  <p>}</p>
  <p>here is my HTML code as requested</p>
  <pre><code>    &lt;!DOCTYPE html&gt;
  </code></pre>
  
  
      
      
      
      
      
      COP2831: Chapter 7 - Regular Expressions
      
  
  
      
      <h1>Regular Expressions - Kevin Taylor</h1>
      
      
      
          Enter Social Security Number:
          
          
              
          
          
         <p>&nbsp;&nbsp;</p>