title: Not able to apply two functions to a React Component
body: <p>What am I doing wrong here when assigning these two functions</p>
  
  <pre><code>function onAdd(e){
      console.log('+++++++++++++');
    }
  function onRemove(e){
      console.log('-------------');
    }
  </code></pre>
  
  <p>to a React Button Component (with two instances)</p>
  
  <pre><code>function onAdd(e){
      console.log('+++++++++++++');
    }
  function onRemove(e){
      console.log('-------------');
    }
  const Button = ({ text, styleClass, onAdd, onRemove }) =&gt; {
    return (
      &lt;button
        type="button"
        onClick={e =&gt; onAdd(e)}
        onClick={e =&gt; onRemove(e)}
        className={'btn ${styleClass}'}
      &gt;
        {text}
      &lt;/button&gt;
    );
  };
  ReactDOM.render(
                 &lt;div&gt;
                      &lt;Button text="Add"  onClick = {(e) =&gt; this.props.onAdd(e)}/&gt;
                      &lt;Button text="Delete"  onClick = {(e) =&gt; this.props.onRemove(e)}/&gt;
                 &lt;/div&gt;
  , window.root);
  </code></pre>
  
  <p>I am getting <code>onRemove is not a function</code> erro on clicking on each of the buttons now </p>