title: Dynamically render a component inside a another component in React
body: <p>I tried to dynamically pass a reference to a class to a container and render it.</p>
  
  <pre><code>    class Test extends React.Component{
          render() {
             return &lt;div&gt;Test&lt;/div&gt;
          }
      }
  
      class HelloWidget extends React.Component{
             constructor(props) {
                super(props);
  
                this.state = {
                    child: Test
                };
             }
  
             render() {
                 return &lt;div&gt;{this.state.child}&lt;/div&gt;;
            }
      }
  
      React.render(&lt;HelloWidget /&gt;, document.getElementById('container'));
  </code></pre>
  
  <p>See it at jsfiddle: <a href="https://jsfiddle.net/coolshare/jwm6k66c/2720/" rel="nofollow noreferrer">https://jsfiddle.net/coolshare/jwm6k66c/2720/</a></p>
  
  <p>It did not render anything...</p>
  
  <p>Any suggestion?</p>
  
  <p>thanks</p>