JSFiddle - React, Tailwind, and code Playground

HTML

<select id="testSelect">
    <option class="red">I am red</option>
    <option class="green">I am green</option>
    <option class="blue">I am blue</option>
</select>
<div id="buttonset">
    <button id="b1">$("#testSelect").find("option:selected").css("color")</button>
    <button id="b1a">$("#testSelect").find("option.red").css("color")</button>
    <button id="b2">$("#testSelect").find("option:eq(0)").css("color")</button>
    <button id="b3">$("#testSelect").find("option:eq(1)").css("color")</button>
</div>

CSS

#testSelect {color:#666}

/*Options*/
.red {color:red}
.green {color:green}
.blue {color:blue}

/*Buttons*/
#buttonset {padding:20px 0}

JavaScript

$("#b1").bind("click", function(){
    alert( $("#testSelect").find("option:selected").css("color") );
});

$("#b1a").bind("click", function(){
    alert( $("#testSelect").find("option.red").css("color") );
});

$("#b2").bind("click", function(){
    alert( $("#testSelect").find("option:eq(0)").css("color") );
});

$("#b3").bind("click", function(){
    alert( $("#testSelect").find("option:eq(1)").css("color") );
});