title: this.props.children is undefined in ReactJS
body: <p>I am working with ReactJS and I am trying to get the children from <code>this.props.children</code> however, it is returning undefined. <a href="http://facebook.github.io/react/docs/multiple-components.html" rel="nofollow">According to the documentation</a> I should have access to this special property. </p>
  
  <pre><code>componentDidMount: function() {
      console.log("this",this) // this ReactCompositeComponent.createClass.Constructor 
      this.setMenuListeners.apply(this);
      this.loadMenuFromServer();
  },
  
  setMenuListeners: function() {
      pubSub.on('mainMenu.menuItemClicked',function() {
          console.log(this.props.children) // undefined
      }.bind(this))
  },
  </code></pre>
  
  <p>And here is some of the code that is rendering the children: </p>
  
  <pre><code>loadMenuFromServer: function() {
      var menus = []
      $.getJSON(APPFS.menuItems,function(data){
          for(var s in data) {
              menus.push(&lt;MenuItem expandable={true} content={s} /&gt;)
              menus.push(&lt;ul onClick={this.menuItemClicked} className="main-menu-submenu"&gt;{
                  this.loopAndAddMenu(data[s]).map(function(result){
                      return(result)
                  })
              }&lt;/ul&gt;)
          }
          this.setState({data:menus})
      }.bind(this));
  },
  
  loopAndAddMenu: function(data) {
      var menus = []
      for(var s in data) {
          menus.push(&lt;MenuItem expandable={false} content={s} key={data[s]} /&gt;)
      }
      return menus
  },
  
  render: function(){
      return (
          &lt;ul className="main-menu"&gt;
              {this.state.data}
          &lt;/ul&gt;
      )
  }
  </code></pre>