React Custom Component - Button - Call JQuery plugin on OnClick event

I want to add legitRipple.js to a custom React Button click event. link to legitRipple JS: https://matthias-vogt.github.io/legitRipple.js/

Here is my draft but it is not working - I don't know how to link the click event and the reference to .ripple() event

Button = class Button extends React.Component {
  constructor(props) {
    super(props);
    this.onClick = this.onClick.bind(this);
    this.state = {

    };
  }
  componentDidMount() {
    //need to add JQuery function - on button click, I need to register an event? or somehow call (ref=buttonEl) $(buttonEl).ripple();

  }

//do I need an componentWillUnmount as well?

  onClick(ev) {
    let onClickFn = this.props.onClick;
    onClickFn && onClickFn(ev);
   //somehow register an event to show the ripple? 
  }
  render() {
    return (
      <div>
        <button type="button" ref="buttonEl" className={this.props.className} onClick={this.onClick.bind(this)}>
          {this.props.children}
        </button>
      </div>
    );
  }
}