title: ReactJS Dialog with close button
body: <p>I want to add close button to my react pop up so I added this line </p>
  
  <pre><code> &lt;button onClick = {$('.scoreboard-trigger').close}&gt;Close&lt;/button&gt;
  </code></pre>
  
  <p>but when I clik Close button it does not close</p>
  
  <p>here is my all component</p>
  
  <pre><code>import $ from 'jquery';
  import React from 'react';
  
  import { FormattedMessage } from 'util/IntlComponents';
  
  import OkeyScoreboard from './OkeyScoreboard';
  
  class OkeyScoreboardDialog extends React.Component {
    componentDidMount() {
      $('.scoreboard-trigger').leanModal({
        opacity: 0
      });
    }
  
  
  
    render() {
      const { scoreboard, profiles } = this.props;
      const scoreboardTitle = &lt;FormattedMessage message="room_title.scoreboard"/&gt;;
  
      return (&lt;div id='scoreboardModal'
           className='scoreboard-modal modal'&gt;
  
         &lt;div className='modal-content'&gt;
              &lt;h4 className='center'&gt;{scoreboardTitle}&lt;/h4&gt;
            &lt;OkeyScoreboard profiles={profiles} scoreboard={scoreboard}/&gt;
                   &lt;button onClick = {$('.scoreboard-trigger').close}&gt;Close&lt;/button&gt;
        &lt;/div&gt;
  
        &lt;div className='modal-footer'&gt;
  
        &lt;/div&gt;
      &lt;/div&gt;);
    }
  }
  
  
  class OkeyScoreboardDialogTrigger extends React.Component {
    render() {
      const scoreboardTitle = &lt;FormattedMessage message="room_title.scoreboard"/&gt;;
  
      return &lt;a className='scoreboard-trigger modal-trigger btn blue-grey darken-3'
                href='#scoreboardModal'&gt;
        {scoreboardTitle}
      &lt;/a&gt;;
    }
  }
  
  
  export { OkeyScoreboardDialog };
  export { OkeyScoreboardDialogTrigger };
  </code></pre>