I have a select with several options and a gray button that pretends to be disabled. I want that if at least one option is chosen, the button will change color.
And this is my function, but I can’t make it change the color of the button
var options = document.getElementById('months').selectedOptions;
var value = Array.from(options).map(({
value
}) => value);
if (value.length > 0) {
let element = document.getElementById("btn_next");
element.classList.remove("color");
element.classList.add("color2");
}
.color {
background: gray;
}
.color2 {
background: orange;
}
<form>
<select id="months" name="months" multiple>
<option value="January">January</option>
<option value="Fabruary">Fabruary</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<input id="btn_next" type="button" class="color" value="NEXT">
</form>