Need help for updating html with javascript


what should I add in function update()

Please point your actual code instead of a picture. Thanks

const progress = document.getElementById("progress");

const prev = document.getElementById("prev");

const next = document.getElementById("next");

const circles = document.querySelectorAll(".circle");

let currentActive = 1;

next.addEventListener("click", () => {

currentActive++;

if (currentActive > circles.length) {

currentActive = circles.length;

}

update();

});

prev.addEventListener("click", () => {

currentActive--;

if (currentActive < 1) {

currentActive = 1;

}

update();

});

function update() { //I need help here

const update = document.getElementById(".progress");

}

const actives = document.querySelectorAll(".active");

progress.style.width =

((actives.length - 1) / (circles.length - 1)) * 100 + "%";

if (currentActive === 1) {

prev.disabled = true;

} else if (currentActive === circles.length) {

next.disabled = true;

} else {

prev.disabled = false;

next.disabled = false;

}

So I am hoping to accomplish a transition to 1-2 when pressing next or prev button with the class progress and without the function update it is not working.
image

After selecting the correct element, you can add a class to it by using the classList method add().

<div id="the-div"></div>
document.getElementById('the-div').classList.add('red');

Now the div has the class red, which you could then style in your CSS.


It would be extremely helpful if you could share a link to the instructions for this task you’re trying to accomplish, as well as a link to a testable version of your code such as on codepen.io or stackblitz.com. Otherwise we can only give you generic advice.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.