All buttons close on click of one button

please i am building a FAQs page and i made a series of buttons which when clicked displays a hidden paragraph underneath each button, now the issue is all buttons respond to one button being clicked on and they all display their respective paragraphs, i want each button to display it's own hidden paragraph alone.

this is the react code i used

class FAQ extends React.Component {
    constructor () {
      super()
      this.state = {
        isHidden: true,
      }
    }

    toggleHidden () {
      this.setState({
        isHidden: !this.state.isHidden})
    }

            <div className="faq--button">
                <button onClick={this.toggleHidden.bind(this)}>button to click</button>
                {!this.state.isHidden && <p>lorem ipsum"</p>}
            </d开发者_StackOverflowiv>

---

Currently isHidden is used for all buttons, which will have the same effect in each button. So you need to add separate states for each button. Like isHidden2, isHidden3....