JSFiddle - React, Tailwind, and code Playground

by danzkusuma

HTML

<div id="container">
    <select id="select">
        <option value="one">one</option>
        <option value="two">two</option>
        <option value="three">three</option>
    </select>
</div>

CSS

#select.red{
    background: red;
    border: 1px solid red;
}

#select.green{
    color: white;
    background: green;
    border: 1px solid green;
}

JavaScript

function checkstate(){
    console.log($(this).val());
}

$(function(){
    $('#select').change(function(){
        console.log($(this).val());
        $(this).removeClass();
        if($(this).val() == "one"){
            $(this).addClass("green");    
        }
        else {
            $(this).addClass("red");
        }
    });
})