title: ReactJS pass to onClick function current div ID
body: <pre><code>export default React.createClass({
  displayName: 'Test',
  
  getInitialState() {
      return {
          activeItem: 0,
      };
  },
  
  onItemClick(item) {
      this.setState({
          activeItem: item
      });
  },
  
  isActive(item) {
      return item === this.state.activeItem;
  },
  
  render() {
      var circle = {
          'one': {
              items: []
          }
      };
  
      ['one'].forEach((k, i) =&gt; {
          for (var j = 1; j &lt;= 3; j++) {
              var itemNo = (i * 10 + j);
              var itemClasses = c('item', 'item-' + itemNo, {
                  'selected': this.isActive(itemNo)
              });
  
              var item = React.DOM.div({
                  key: "item" + itemNo,
                  className: itemClasses,
                  onClick: () =&gt; this.onItemClick(itemNo)
              }, itemNo);
              circle[k].items.push(item);
          }
      });
  
  
      return ( 
        &lt;div&gt;{circle.one.items}&lt;/div&gt;
      );
  }
  });
  </code></pre>
  
  <p>The <code>circle.one.items</code> array is being populated by <strong>dynamically</strong> generated divs and should contain:</p>
  
  <pre><code>&lt;div class="item item-1"&gt;1&lt;/div&gt;
  &lt;div class="item item-2"&gt;2&lt;/div&gt;
  &lt;div class="item item-3"&gt;3&lt;/div&gt;
  </code></pre>
  
  <p>No matter what div I click on, only the 3rd one gets selected because <code>itemNo</code> last value is 3.</p>
  
  <p>Look at: <code>onClick: () =&gt; this.onItemClick(itemNo)</code>. This is wrong. How can I pass the ID of the div I'm clicking to <code>onItemClick()</code>?</p>