JSFiddle - React, Tailwind, and code Playground

by ptomblin

HTML

<select id="selectbox1">
    <option value="">Select an option&hellip;</option>
    <option class="aye_c" value="aye">Aye</option>
    <option class="eh_c" value="eh">Eh</option>
    <option class="aye_c"value="ooh">Ooh</option>
    <option class="none_c" value="whoop">Whoop</option>
</select>

CSS

.aye_c {
    font-weight: normal;
    color: red;
}
.eh_c {
    color: black;
    font-weight: bold;
}
.none_c {
    color: black;
    font-weight: normal;
}

JavaScript

$('#selectbox1').on("change", function() {
    this.className = this.selectedOptions[0].className
});