title: How do I style a selected option string with 2 different colors using CSS?
body: <p>I have a dropdown select element with car names and their available colors inside parentheses. I would like to be able to do something like this:</p>
  
  <pre><code>&lt;select class="cars"&gt;
     &lt;option&gt;Rolls Royce Phantom &lt;span class="car-color"&gt;(silver)&lt;/span&gt;&lt;/option&gt;
     &lt;option&gt;Ferrari 488GTB &lt;span class="car-color"&gt;(yellow)&lt;/span&gt;&lt;/option&gt;
     &lt;option&gt;Chevrolet Camaro &lt;span class="car-color"&gt;(black)&lt;/span&gt;&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>where</p>
  
  <pre><code>.cars {
     color: black;
     font-weight: bold;
  }
  .car-color {
     color: grey;
     font-weight: normal;
  }
  </code></pre>
  
  <p>This code above is not working, unfortunately. How do I reach a desired effect?</p>