notifications-page-main with HTML and SCSS, FLEXBOX and JAVASCRIPT

Community feedback

• 

  Rob Simpson•490

  @pertrai1Posted over 1 year ago

  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

  0

  ---

  

  Bogdan-Mihail Pavel•625

  @codeguy9Posted over 1 year ago

  @pertrai1 Thanks for the feedback; How can I loop over each of them?

  0

  

  Rob Simpson•490

  @pertrai1Posted over 1 year ago

  @codeguy9

  You have a couple options:

  1. You can use forEach - https://developer.mozilla.org/en-US/docs/Web/API/NodeList
  2. 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.

  1