title: How to change background color only of selected option with javascript?
body: <p>I'm trying to change background color when user selects some option. I did it with onchange function that simply contains:</p>
  
  <pre><code>function colorSameValues(select, color){
      for (var i=0; i&lt;selects.length; i++){
          if (selects[i].value ==='') selects[i].style.backgroundColor='';
          if (selects[i].value === select.value) selects[i].style.backgroundColor=color;
      }
  }
  </code></pre>
  
  <p>but it changes background color of all options.</p>
  
  <p>I also saw on the internet how to change color of selected option, but it doesn't change option that is displayed, like here (first response) - <a href="https://stackoverflow.com/questions/53356775/change-the-color-of-an-option-when-selected-javascript">Change the color of an option when selected - JavaScript</a></p>
  
  <p>I would like to color displayed option, and when user clicks on this select to see other options I would like them not to be colored at all.
  Any ideas?</p>
  
  <p><a href="https://i.stack.imgur.com/m6lQP.png" rel="nofollow noreferrer">This is what I am trying to get</a></p>