There are similar questions like this, but I either can't find what I am looking for, or I may be missing something. Here is the code below.
<select id="colorSelector" onchange="getColor()">
<option>Choose a color</option>
<option value="green">Green</option>
<option value="red">Red</option>
</select>
JS
function getColor(){
if(document.getElementById('colorSelector').value = "green"){
document.getElementById('mainButton').setAttribute('onclick', 'colorChangeGreen()')
}else if(document.getElementById('colorSelector').value = "red"){
document.getElementById('mainButton').setAttribute('onclick', 'colorChangeRed()')
}}
After I open dropdown and choose either of the two colors, it always chooses green and then I can't choose red. I am wondering what I need to edit to be able to choose other colors, I wanted to put a few more options in. Thank you
<select id="colorSelector" onchange="getColor()">
<option>Choose a color</option>
<option value="green">Green</option>
<option value="red">Red</option>
</select>
<input type="button" id="mainButton" value="color" />
<script>
function getColor(){
if(document.getElementById('colorSelector').value == "green"){
document.getElementById('mainButton').setAttribute('onclick', 'colorChangeGreen()')
}else if(document.getElementById('colorSelector').value == "red"){
document.getElementById('mainButton').setAttribute('onclick', 'colorChangeRed()')
}}
</script>