title: Change dropdown colour on selection
body: <p>I have a dropdown which has different colours for each option, however when the option is chosen I would like the select background to change to the color I have chosen. </p>
  
  <p>I have found an answer to this query, however this uses inline styles and I would like to use my external CSS.</p>
  
  <p><a href="https://stackoverflow.com/questions/4930539/changing-color-of-a-row-in-dropdown-list">Changing color of a row in dropdown list</a></p>
  
  <p><a href="http://jsfiddle.net/yahavbr/LD8Dx/" rel="nofollow noreferrer"><strong>See My JSFiddle</strong></a></p>
  
  <pre><code>&lt;select name="select" style="background-color: #ff0000" onchange="this.style.backgroundColor = this.options[this.selectedIndex].style.backgroundColor;"&gt;
   &lt;option style="background-color: #ff0000" value="1"&gt;Red&lt;/option&gt;
   &lt;option style="background-color: #00ff00" value="2"&gt;Green&lt;/option&gt;
   &lt;option style="background-color: #0000ff" value="3"&gt;Blue&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>