I’m trying to animate a div when a button is clicked. The class is added correctly, but the animation doesn’t run. Here’s my minimal code:

function toggleBox() { document.getElementById("box").classList.toggle("animate"); } #box { width: 100px; height: 100px; background: red; transition: transform 1s ease; } .animate { transform: translateX(200px); } <button onclick="toggleBox()">Toggle</button> <div id="box"></div>

kikon's user avatar

kikon

9,9903 gold badges11 silver badges40 bronze badges

Ayush Raj's user avatar

New contributor

Ayush Raj is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.

1

I transformed your code to a stack snippet and it seems the animation works.

2025-11-28 19:09:02 +00:00

Commented 1 min ago

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.