Is it possible to set the background-color of a specific option in a choice list?

[uluerje]

I have a choice list with red, green, yellow, and I need it to display the actual color instead of the word when the user expands the dropdown.   If I can't accomplish this through modifying the CSS, would it be possible to use a macro in place of the field?    

[robert_merriman]

Can you help clarify what u_deliverable is in the follow bit of code?

var x = document.getElementById("u_deliverable.u_risk_level");

[uluerje]

u_deliverable.u_risk_level is just a choice list on the form that I created using the OOTB functionality.   The field was actually created on another table so that's why the u_deliverable is there.   I set variable x to that choice list and then add the options to x.   I ended up going with a jquery dropdown instead of the one above because I couldn't get rid of the blue highlight.  

[Naveen Kumar J]

Hi Jessica,

Hi Experts,

I tried with the below script to add the colors to the choice list.

g_form.clearOptions('u_risk_level');

  var x = document.getElementById("u_deliverable.u_risk_level");

  var option1 = document.createElement("option");

  option1.text = "Green";

  option1.name = "Green";

  option1.value = "1";

  option1.style.backgroundColor = '#32CD32';

  option1.style.color = '#32CD32';

x.add(option1);

var option2 = document.createElement("option");

  option2.text = "Red";

  option2.name = "Red";

  option2.value = "1";

  option2.style.backgroundColor = 'Red';

  option2.style.color = 'Red';

x.add(option2);

However once i select the color, it is showing the default white color instead of green. Please assist.

Thank you.

[nagaraju8]

Hi Jessica,

could you please share complete script.

Regards,

NJ