How to use JavaScript to change text color in Single Select Dropdown


I need to change the text colors of the items in a Single Select Drop-down cf. Using the 'Inspect' feature in chrome, I have found the correct property that needs to be changed, but I just cannot figure out the correct syntax to access the 'color' property and change it.

I have some basic java-script that is correctly capturing the chosen value, but cant seem to nail down the correct syntax to change the color..

<script type="text/javascript" >
var sel = document.getElementById('customfield_10808');
state = sel.options[sel.selectedIndex].text;
if (state == 'RED')
{  alert(sel.options[sel.selectedIndex].text); // works and alerts selected value
// AJS.$( = red); // does not work
// AJS.$('#sel').css('color', cl); // does not work
// AJS.$("#sel").find("option").css("color", "red"); // does not work
// AJS.$("sel").form.aui. text.color: red); // does not work
// document.querySelector('#customfield_10808 aui-option[color="red"]'); // does not work
// AJS.$(sel.css.aui-option[color="red"]'); // does not work
// <style>#customfield_10808-val{color:red}</style>; // does not work
// AJS.$("sel").aui-select2-container[color="red"];  // does not work
// AJS.$("sel").aui-select2-container {color: #333;}; // does not work
// What to do????




Jira 7.1. Any advice appreciated, its driving me nuts!!!! smile

1 answer

1 accepted

Instead of using build-in single select and JS hacks, you can use our Custom Fields++ add-on. It provides following extra features on top of original single select field:

  • coloring for each option (any css style)
  • icons for each option
  • extra help text that is shown when users hover on an option
  • auto complete

They are direct replacement of build-in custom fields so migration is very easy. In addition to single select it has extra custom fields too. 


Excellent, thanks for the tip!

Is there a version for JIRA 7.1? the marketplace only seems to list it for 7.2 and higher...

@Paddy Byrne,

Yes the latest version supports 7.0.0 and up. But you need to click on more versions and download the version with -jira7.0.0 suffix.

Suggest an answer

Log in or Join to answer
Community showcase
Teodora [Botron]
Published Thursday in Marketplace Apps

Jira Inferno: The Nine Circles of Jira Administration Hell

If you spend enough time as a Jira admin - whether you are managing a single, mid-sized instance, a large enterprise one or juggling multiple instances at once - you will eventually find yourself in ...

240 views 0 11
Read article

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you
Atlassian Team Tour

Join us on the Team Tour

We're bringing product updates and pro tips on teamwork to ten cities around the world.

Save your spot