JavaScript classList — exercises and bug fixes
5 hands-on exercises and 5 find-the-bug challenges for the JavaScript classList lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.
Exercises(5)
- 1
Add a class
easy10 minAdd the class active and report the full class list.
- 2
Remove a class
easy10 minRemove the class one and report what is left.
- 3
Toggle a class on
easy10 minToggle the class open and report whether it is present.
- 4
Check for a class
easy10 minReport whether the element has the class done.
- 5
Add several classes
medium10 minAdd three classes at once and report how many the element now has.
Find the bug(5)
- 1
Fix className wiping the other classes
easy8 minAssigning to className replaces every class.
- 2
Fix the dot in the class name
easy8 minclassList takes a bare name, without a dot.
- 3
Fix the toggle called twice
easy8 minToggling twice puts the class back where it started.
- 4
Fix contains used to add
easy8 mincontains only checks; it does not change anything.
- 5
Fix the wrong class removed
easy8 minThe class that should stay is being taken off.
Ready to write the code?
The editor, the automatic checks and the worked solutions open up with an account.
Open the workspace