title: remove selected option background color when focus on other option in React JS
body: <p>I am working on drop down which is working fine.
  after i selected option from drop down it background color got changed(lime).
  now i focus on another option which color got changed(mango). in this scenario both mango and lime color looking same.how to remove selected option background color when focus on other</p>
  <p>code:</p>
  <pre><code>&lt;select&gt;
    &lt;option value=&quot;grapefruit&quot;&gt;Grapefruit&lt;/option&gt;
    &lt;option value=&quot;lime&quot;&gt;Lime&lt;/option&gt;
    &lt;option value=&quot;coconut&quot;&gt;Coconut&lt;/option&gt;
    &lt;option value=&quot;mango&quot;&gt;Mango&lt;/option&gt;
  &lt;/select&gt;
  
  select option:hover,
      select option:focus,
      select option:active {
          background: linear-gradient(#000000, #000000);
          background-color: #000000 !important; /* for IE */
          color: #ffed00 !important;
      }
  
      select option:checked {
          background: linear-gradient(#d6d6d6, #d6d6d6);
          background-color: #d6d6d6 !important; /* for IE */
          color: #000000 !important;
      }
  </code></pre>