title: Why is my onClick event not triggering on React?
body: <p>I can't spot why my <code>onClick</code> event is not working in my React app.</p>
  <p>I'm trying to create a line of <code>div</code>s with the letters of the alphabet. When one of the <code>div</code>s is clicked, the <code>div</code> with its letter should be removed from the line.</p>
  <p>I've attached the <code>onClick</code> event to the <code>div</code>s as part of a mapping of an alphabet string in my state, but I seem to be missing/overlooking something, because I can't click on the <code>div</code>s at all.</p>
  <p>I've made sure to bind the function in constructor.</p>
  <pre><code>let { Grid, Row, Col } = ReactBootstrap;
  
  class Letter extends React.Component {
    
    render () {
      const style = { border: '1px solid black',
                      display: 'inline-block',
                      fontSize: '4vw',
                      width: '4vw',
                      height: '8vh',
                      textAlign: 'center'};
      
      return (&lt;div style={style} key={this.props.key}&gt;
                {this.props.letter}
              &lt;/div&gt;);
      
    }
  }
  
  class MyComponent extends React.Component {
    constructor(props) {
      super(props);
      
      this.state = {
        alpha: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
      };
      
      this.callLetter = this.callLetter.bind(this);
    }
   
    callLetter(e) {
      var letterindex = this.state.alpha.indexOf(e.currentTarget.attributes[0].value);
      var alphaclone = this.state.alpha;
      
      alphaclone = alphaclone.slice(0, letterindex) + alphaclone.slice(letterindex + 1);
      
      this.setState({alpha:alphaclone});
    }
    
    render() {
  
      return (   
        &lt;Grid&gt;
          &lt;Row className=&quot;show-grid&quot; &gt;
            {this.state.alpha.split('').map((item, i) =&gt;
              (
                  &lt;Letter letter = {item} key = {i} onClick = {this.callLetter}/&gt; 
              ))}
          &lt;/Row&gt;
        &lt;/Grid&gt;
      );
    }  
  }
  
  ReactDOM.render(
    &lt;MyComponent/&gt;,
    document.getElementsByClassName('container-fluid')[0]
  );
  </code></pre>
  <p>Thank you.</p>