I'm trying to enable the background color change feature upon clicking a button based on the selection made from a dropdown. Below are the HTML and JavaScript snippets for reference.
<!DOCTYPE html>
<html>
<head>
<title>Color Change Demo</title>
<script>
function changeBackground(){
var selectedColor = document.getElementById("selColor");
var colorValue = selectedColor.value;
document.body.style.backgroundColor = colorValue;
}
</script>
</head>
<body>
<form action="">
<fieldset>
<select id="selColor">
<option value="FFFFFF">White</option>
<option value="FF0000">Red</option>
<option value="FFCCFF">Orange</option>
<option value="FFFF00">Yellow</option>
<option value="00FF00">Green</option>
<option value="0000FF">Blue</option>
<option value="663366">Indigo</option>
<option value="FF00FF">Violet</option>
</select>
<input type="button" value="Change Color" onClick="changeBackground()"/>
</fieldset>
</form>
</body>
</html>
Despite my efforts, I can't seem to get it to work properly. Any assistance would be greatly appreciated.
Thank you