Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

144
Views
How to change class and recall the class back using javascript

Iam trying to give 2 different colors on my timer countdown apps..

on workout timer will be green.

on rest timer will be red. (and the color will be red until end)

my question is how to make the timer back to green after rest timer(red) and back to red after green(workout timer)

document.getElementById('start').addEventListener('click', startCountdown);

    function startCountdown() {
      let counter = 3,
        mode = "Workout",
        rounds = 1;
      const interval = setInterval(function() {
        counter--;

        if (mode == "Workout" && counter >= 0) {
          id = document.getElementById("count");
          id.innerHTML = "ROUND " + rounds + " <br> " + counter;
          id.classList.add('green') <<<THE FRIST COLOR RUNNING WELL
        } else {
          id = document.getElementById("count");
          id.innerHTML = "REST " + " <br> " + counter;
          id.classList.add('red') <<< SECOND COLOR RUNNING WELL
        }

        if (counter === 0) {
          if (mode == "Workout") {
            mode = "Rest";
          } else {
            mode = "Workout";
            rounds++;
          }
          id.innerHTML = "DONE";
          counter = 3;
          if (rounds == 21) {
            clearInterval(interval);
          }
        }

      }, 1000);
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

add this near line 9 (mode == "Workout" && counter >= 0) ? clsnm="green" : clsnm="red"; and pass this variable near id.classList.add(clsnm)

alternatively you can also try to add id.classList.remove('class_name') before id.classList.add('class_name')

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!