css - Change color in drop-down where jquery change multiply drop-down-menu -

I use a jquery to change the drop-down menu multiplied with one selection. And I use a drop-down menu to make changes for everyone else.

I've added a different background color for each option and when I change an option on the drop-down menu, all those background colors will not be displayed on other drop-down menus.

How can I get it?

Here is jquery

  function addMessage (msg, obvious) {if (obvious! == blank & clear) {$ ('# msgs'). Html (""); } $ ('# Msgs'). Attachments (msg + " & gt; } Select on function () {var stext = $ ("# s_make option: selected"). Val (); AddMessage ("You selected:" + stext); Switch (stack) {case "opt_1": $ ("# s_score> option [value = 'xml_multi_01.php']"). Ether ('selected', 'selected'); break; Case "opt_2": $ ("# s_score> option [value = 'xml_multi_02.php']"). Ether ('selected', 'selected'); break; Case "opt_3": $ ("# s_score> option [value = 'xml_multi_03.php']"). Ether ('selected', 'selected'); break; Case "opt_4": $ ("# s_score> option [value = 'xml_multi_04.php']"). Ether ('selected', 'selected'); break; }} Function init () {addMessage ("init () 
 

and html

  & lt; Select ID = 's_make' onChange = "this.style.backgroundColor = this.options [this. Scaled index] .style.backgroundColor" & gt; & Lt; Option value = '-' style = "background: #ffffff;" & Gt; Change all options in ... & lt; / Options & gt; & Lt; Option value = 'opt_1' style = "background: # beepie 29c;" & Gt; Option 1 & lt; / Options & gt; & Lt; Option value = 'opt_2' style = "background: # 9cc 474;" & Gt; Option 2 & lt; / Options & gt; & Lt; Option value = 'opt_3' style = "background: # b 6 dfb;" & Gt; Option 3 & lt; / Options & gt; & Lt; Option value = 'opt_4' style = "background: # 6cace8;" & Gt; Option 4 & lt; / Options & gt; & Lt; / Select & gt;  

Option 1 Option 2 Option 3 Option 4

Option 1 Option 2 Option 3 Option 4

Take a look at this jsfiddle and you will see what I mean:

There are a number of ways to get in, for example you can update the color of the other select while changing your 'main' selection:

 < Select at code> function () {$ ("# S_score"). CSS ('background color', this.style.backgroundColor); // Other code ...}  

See partially working (this only changes the selection color of 2 because you have the same ID for 2 and 3)