My task involves adjusting the background color of a button based on changes in the target value. Initially, I set the target value to "10". When I click my "1" button and decrease it to "9", the background color of the button changes to "red" because the input value is now lower than the target value. However, I encountered an issue when I attempted to change the target value by using the "Change Target Value" button. The trigger was supposed to re-evaluate the target value against the button's value, updating the background color based on the arithmetic operator. Unfortunately, my code is not functioning correctly. Can someone please assist me?
https://i.sstatic.net/06s3c.png
// JavaScript code snippet
// Get the modal
var modal = document.getElementById('myModal');
// Get all buttons except reset and submit buttons
var btns = document.querySelectorAll('button:not([id=reset]):not([id=submit])');
// Set initial target value
var TV = document.getElementById('inputtarget');
// Event listener for each button to open modal
for (var i = 0; i < btns.length; i++) {
btns[i].onclick = function() {
TV.setAttribute('startbtn', this.id);
modal.style.display = "block";
}
}
// Additional JavaScript code continues...
#b1,
#b2,
#b3 {
/* Button styling */
}
/* Additional CSS styling goes here... */
HTML elements related to the buttons, inputs, and modals are outlined within the code snippet.