title: add dynamic onClick events in react
body: <p>To describe my issue I will start by showing the jsx markup:</p>
  
  <pre><code>&lt;Selector&gt;
      &lt;ItemCategory title="A Special Category"&gt;
          &lt;Item title="PDF File" file="/file.pdf" /&gt;
      &lt;/ItemCategory&gt;
      &lt;Item title="PDF File 2" file="/file2.pdf" /&gt;
  &lt;/Selector&gt;
  </code></pre>
  
  <p>Basically I have a list of PDFs I want to display. Items can belong to a category or not. In the Selector-Component I have the current selected PDF as a state. See my current Selector Component below.</p>
  
  <pre><code>export class Selector extends React.Component {
  
    constructor(props) {
      super(props);
      this.state = {
        currentSelection: null
      };
    }
  
    render() {
      var currentSelection = this.state.currentSelection || &lt;NothingSelected /&gt;;
  
      return (
        &lt;div className={"selector " + this.props.className}&gt;
          &lt;div className="sidemenu"&gt;
            &lt;HeaderItem /&gt;
            &lt;div className="sidemenu-area"&gt;
              {this.props.children}
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="selector-area"&gt;
            {currentSelection}
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>Now I want if you click on an Item-Component to change the current selection to the clicked Item.</p>
  
  <p>Any idea how I can add the onClick events?</p>