title: Reactjs: binding onClick to a dynamically created list component
body: <p>Say I have a render function that looks like this:</p>
  
  <pre><code>  render() {
  
  
      var user_rows = []
      this.state.user_list.forEach(function (user, index){
          user_rows.push(
                &lt;tr key={user}&gt;
                &lt;td&gt;&lt;div className="btn-toolbar"&gt;&lt;button type="button" onClick={this.editUser.(usesr.sso)} className="btn btn-success-outline"&gt;Edit&lt;/button&gt;&lt;/div&gt;&lt;/td&gt;
              &lt;/tr&gt;)
      }) 
  
  return (&lt;tbody&gt;
          {user_rows}
        &lt;/tbody&gt;)
  </code></pre>
  
  <p>I get the error:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'editUser' of undefined</p>
  </blockquote>
  
  <p><strong>I would like like the onClick to:</strong></p>
  
  <p><strong>1.</strong> Not run when the component is created, only run when actually clicked</p>
  
  <p><strong>2.</strong> bind to the function within this component properly</p>
  
  <p>I tried:
  <code>onClick={this.editUser.bind(null, user.sso)}</code>, but didn't seem to work in this case.</p>