title: JS RegEx to return a hyphenated word and then another word/value
body: <p>I'm having some RegEx trouble, but I am aiming for this snippet of code to read an input such as <code>&quot;background-colour:red;&quot;</code> , validate the syntax, then take &quot;background-colour&quot; and &quot;red&quot; into an array. It currently returns <code>[&quot;background-colour&quot;]</code> , but not red, and I've spent around an hour to try and figure it out. Could anyone help or point me in the right direction? I've managed to get simple ones like <code>&quot;opacity:1;&quot;</code> and <code>&quot;colour:red;&quot;</code> to work but the hyphen has thrown a wrench in it.</p>
  <pre><code> let ed = document.getElementById(&quot;editor&quot;).innerText; 
   let dest = document.getElementById(&quot;destination&quot;);
  
  //irrelevent code stripped here 
  
      regex3 = new RegExp(/^[a-zA-Z]+-[a-zA-Z]+:[a-zA-Z]+;$/i);
          
          //irrelevent code stripped here 
  
          else if (regex3.test(ed)) {
                      console.log(&quot;valid input&quot;);
                      let pattern = /\w+\-\w+/g;
          
                      let temp = ed.match(pattern);
                      console.log(temp);
          
                      let att = temp[0];
          
                      let quant = String(temp[1]);
          
                      console.log(att);
                      console.log(temp);
                      dest.style.setProperty(att, quant);
                      
  </code></pre>