How to remove a class from an inactive React element?

Question

React

Hello! Just started learning React, so I apologize for the stupid question.
It is necessary that when adding the clicked class to one element, it is removed from another, how to do this?

choiseCross(event) {
    event.target.classList.add('clicked');
}

render() {
    return (
         <div className="choise clicked" onClick={this.choiseCross}>X</div>
         <div className="choise" onClick={this.choiseCross}>O</div>
    );
}

Answer 1

You're trying to use a slightly different approach. You should not remove the class, but just render it only for the active element. That is, when onClick fires, write to the state some value corresponding to your div element. In the render method itself, when rendering each div, add a condition with a check if its value is equal to what is in the state. If yes, then you render the clicked class. You will need the classNames library for this task .