Change selected item color - select > option

Question

I got the following select.

It is possible to change his blue color to one I want to apply, red for example?

Answer 1

Elements SELECT are rendered by the operating system, not HTML. You cannot change this blue color because it is the default OS.

"The alternative is to use libraries that customize select, usually turned into dropdowns and others (Example: bootstrap select - silviomoreto.github.io/bootstrap-select)."

But Voce can change some things without using dropdowns:

var select = document.getElementById('mySelect');
select.onchange = function () {
    select.className = this.options[this.selectedIndex].className;
}

.redText {
    background-color:#F00;
}
.greenText {
    background-color:#0F0;
}
.blueText {
    background-color:#00F;
}

<select id="mySelect" class="greenText">
    <option class="greenText" value="apple" >Apple</option>
    <option class="redText"   value="banana" >Banana</option>
    <option class="blueText" value="grape" >Grape</option>
</select>