@pertrai1
Posted
Great work on the solution you have come up with.
Check in your JS and notice that you are using querySelector
for the selected-tab
, but there are multiple elements in the DOM that have this class. Because of this you will need to use querySelectorAll
and then loop over each of them to add the class inactive
. See if that helps get you going in the right direction.
Marked as helpful
@codeguy9
Posted
@pertrai1 Thanks for the feedback; How can I loop over each of them?
@pertrai1
Posted
@codeguy9
You have a couple options:
- You can use
forEach
- https://developer.mozilla.org/en-US/docs/Web/API/NodeList - You can turn into an array and then use the available array methods. To turn into array, you can use
Array.from(document.querySelectorAll(...))
or[...document.querySelectorAll(...)]
.
To me, it seems like the logic would be to take the single selector that is in the callback of the click handler you have, and loop over to add the class to the selector.
If this does not get you to the solution, you can post back here and tell me where you get stuck.