I am writing a simple script for a js counter that increments or decrements the count everything is working fine but the text color isn’t getting changed, I want the color to be red if the count is negative and green if it’s positive here’s my script:
let counting = document.getElementById("counting");
let increaseBtn = document.getElementById("increase-btn");
let decreaseBtn = document.getElementById("decrease-btn");
let resetBtn = document.getElementById("reset-btn");
let value = document.getElementById("value")
let counter = 0;
increaseBtn.addEventListener("click", ()=>{
counting.innerHTML = ++counter;
updateColor();
});
decreaseBtn.addEventListener("click", ()=>{
counting.innerHTML = --counter;
updateColor();
});
resetBtn.addEventListener("click", ()=>{
counting.innerHTML = counter = 0;
updateColor();
});
function updateColor(){
if(counter > 0){
value.style.color = "green";
}
else if(counter < 0){
value.style.color = "red";
}
else {
value.style.color = "black";
}
}