title: how to render child components in react.js recursively
body: <p>I wanted to recursively add a react component from within its own component. I saw this example of a <a href="http://webcache.googleusercontent.com/search?q=cache:Qi8MAZjs03EJ:www.gumtree.com/devteam/2014-12-12-creating-a-treeview-using-reactjs.html+&amp;cd=1&amp;hl=en&amp;ct=clnk&amp;gl=us">tree component</a> which was mapping through the child TreeNodes and adding child nodes in the same way. Unfortunately it doesn't work at all for me. The idea was to have a simple comment component, and the replies would reuse the same component.</p>
  
  <pre><code>var Comment = React.createClass({
    render: function() {    
      return (
          &lt;div className="comment"&gt;
  
            {/* text and author */}
            &lt;div className="comment-text"&gt;
              &lt;span className="author"&gt;{this.props.author}&lt;/span&gt;         
              &lt;span className="body" dangerouslySetInnerHTML={{__html: this.props.body}} /&gt;
            &lt;/div&gt;
  
            {/* replies */}
            &lt;div className="replies"&gt;
             {
               this.props.replies.map(function(reply) {
                 &lt;Comment body={reply.body} author={reply.author} /&gt;
               }.bind(this))
            }
            &lt;/div&gt;
  
        &lt;/div&gt;
      );
    }
  });
  </code></pre>
  
  <p>I get the following error message: </p>
  
  <p><i><b>Uncaught TypeError: Failed to construct 'Comment': Please use the 'new' operator, this DOM object constructor cannot be called as a function.</b></i></p>
  
  <p>here is an example of the JSON data passed to the component.</p>
  
  <pre><code>{ "author" : "Some user",
    "body" : "&lt;div&gt;Great work&lt;/div&gt;",
    "replies" : [ { "author" : "A user replying",
          "body" : "&lt;div Yes it was great work&lt;/div&gt;"
        },
        { "author" : "Another user replying",
          "body" : "&lt;div It really was great work!&lt;/div&gt;"
        }
      ]
  }
  </code></pre>