JSFiddle - React, Tailwind, and code Playground
HTML
<select id="my-select">
<option style="background-color: green">Successful</option>
<option style="background-color: orange">Process Failure</option>
<option style="background-color: purple">Abandoned</option>
</select>
CSS
select {
/* default background color */
background: gold;
}
JavaScript
var mySelect = document.getElementById('my-select');
var setBgColor = function (select) {
select.style.backgroundColor = select.options[select.selectedIndex].style.backgroundColor;
};
mySelect.onHover = function(select){
}
mySelect.onchange = function () {
setBgColor(this);
};