title: bootstrap checkbox button did not triggered in react
body: <p>I want to re-write <a href="https://v4-alpha.getbootstrap.com/components/buttons/#checkbox-and-radio-buttons" rel="nofollow noreferrer">https://v4-alpha.getbootstrap.com/components/buttons/#checkbox-and-radio-buttons</a> in <code>react</code>. Kindly review <a href="https://codepen.io/gamesover/pen/MoExWo?editors=1111" rel="nofollow noreferrer">https://codepen.io/gamesover/pen/MoExWo?editors=1111</a> . There are two issues</p>
  
  <ol>
  <li>Clicking <code>checkbox1</code>, <code>handleChange</code> is not triggered </li>
  <li>Given <code>checkbox1</code> initial status is <code>on</code>, click the <code>checkbox1</code>, its status becomes <code>off</code>. However, the background color is still dark, you have to click somewhere else to make the button background color become light(off status)</li>
  </ol>