title: How can I toggle a class on click with React?
body: <p>I am trying to figure out how to toggle an active class on click to change CSS properties.</p>
  <p>My code is below. Can anyone advise how I should do this? Without creating a new component for each item is it possible to do this?</p>
  <pre><code>class Test extends Component(){
  
      constructor(props) {
    
      super(props);
      this.addActiveClass= this.addActiveClass.bind(this);
    
    }
    
    addActiveClass() {
      
      //not sure what to do here
      
    }
  
      render() {
      &lt;div&gt;
        &lt;div onClick={this.addActiveClass}&gt;
          &lt;p&gt;1&lt;/p&gt;
        &lt;/div&gt;
        &lt;div onClick={this.addActiveClass}&gt;
          &lt;p&gt;2&lt;/p&gt;
        &lt;/div&gt;
          &lt;div onClick={this.addActiveClass}&gt;
          &lt;p&gt;3&lt;/p&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    }
  
  }
  </code></pre>