After experimenting with various methods to change the color of disabled select items, I found success in Chrome but hit a roadblock in IE. Despite trying ::ms-value, the red color was applied to all disabled select fields, which was not the desired outcome. Is there a way to achieve this using jQuery or even CSS? Your input is greatly appreciated.
HTML
<select class="select_red" disabled>
<option>--Select--</option>
<option class="red">one</option>
<option>two</option>
<option class="red">three</option>
<option>four</option>
</select>
Script
jQuery(document).on("change", ".select_red", function(event){
if($(this).find("option:selected").hasClass("red")){
$(this).addClass("redtext");
}else {
$(this).removeClass("redtext");
}
CSS
.redtext{color:#f00 !important;}
.redtext, .select_red:disabled{color:#f00 !important;}