How to add active class to clicked item in ReactJS

Question

I have an array of objects that contain keypair values for the navbar links, I have mapped the array to list and rendering it successful, but when I try to add class to only act

Answer 1

The issue is this line of code:
const currentClass = document.getElementsByClassName('side_nav_item');

is grabbing all your HTML elements with the side_nav_items CSS class and in your case this is all your side nav links. You probably want to use:

let element = document.getElementById(id);

to just get the side nav element which was clicked identified by it's id. Then you can use an element.classList.add('active_item'); to add the active_item css class to the selected side nav item.

Hopefully that helps!