I have two different buttons and I'm trying to add active class in React,but on click is added to both at the same time. Active class has a background white. Initial class has a blue background.
This is my code.

```
import React, { PureComponent } from "react";

class AnimationSettings extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      active: true
    };
  }

  handleClick = () => {
    this.setState({ active: !this.state.active });
  };

  render() {
    const { active } = this.state;
    console.log(active);
    return (
      <div className="animation-buttons">
        /}
        <button
          onClick={this.handleClick}
          className={active ? "btn-animation" : "active-animation"}
        >
          On
        </button>
        <button
          onClick={this.handleClick}
          className={active ? "btn-animation" : "active-animation"}
        >
          Off
        </button>
      </div>
    );
  }
}

export default AnimationSettings;

```