JSFiddle - React, Tailwind, and code Playground

by wllai2001

HTML

<select class="egg me" id="test">    
    <option value="red">1</option> 
    <option value="yellow">2</option> 
    <option value="green">3</option> 
</select>
<select class="me" id="test">
    <option value="red">1</option> 
    <option value="yellow">2</option> 
    <option value="green">3</option> 
</select>
<select class="egg noselected" id="test">
    <option value="red">1</option> 
    <option value="yellow">2</option> 
    <option value="green">3</option> 
</select>
<div></div>

CSS

.red{
    background:red;   
}
.yellow{
    background:yellow; 
}
.green{
    background:green; 
}

JavaScript

/*Select 底色變換測試*/
$("select.egg").click(function(){
    var $this = $(this);
    $("div").html($this.val());	
    $this.removeClass("red yellow green");
    $this.addClass($this.val());
});


$("select.noselected").val(-1);