DOM Manipulation

querySelectorAll

querySelectorAll

querySelectorAll returns every element that matches a CSS selector. The result is a list-like collection, so changing the collection itself does not change the page. You still need to visit each element and update it.

This matters when a page shows repeated UI: tasks, cards, table rows, messages, or badges. A common mistake is selecting only the first match and wondering why the rest of the interface stays unchanged.

Your task: Find every open task in the list and add the is-queued class to each one. Completed tasks should keep their original classes.

Free with a JS Exercises account

Sign in to start coding, run your solution, and keep your progress saved for later. No payment needed.

By continuing, you agree to our Terms and Privacy Policy. We'll send occasional product updates and news. You can unsubscribe anytime.

querySelectorAll

querySelectorAll returns every element that matches a CSS selector. The result is a list-like collection, so changing the collection itself does not change the page. You still need to visit each element and update it.

This matters when a page shows repeated UI: tasks, cards, table rows, messages, or badges. A common mistake is selecting only the first match and wondering why the rest of the interface stays unchanged.

Your task: Find every open task in the list and add the is-queued class to each one. Completed tasks should keep their original classes.

Free with a JS Exercises account

Sign in to start coding, run your solution, and keep your progress saved for later. No payment needed.

By continuing, you agree to our Terms and Privacy Policy. We'll send occasional product updates and news. You can unsubscribe anytime.

Console

Run code to see output.