Text color isn’t getting changed

  Kiến thức lập trình

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";
    }
}

LEAVE A COMMENT