title: List elements not rendering in React
body: <p>This is my Sidebar component.</p>
  
  <pre><code>const Sidebar = React.createClass({
    render(){
      let props = this.props;
      return(
        &lt;div className= 'row'&gt;
        &lt;h2&gt;All Rooms&lt;/h2&gt;
          &lt;ul&gt;
            {props.rooms.map((room, i) =&gt; {
              &lt;li key={i}&gt; {room.name} &lt;/li&gt;
            })}
          &lt;/ul&gt;
          {props.addingRoom &amp;&amp; &lt;input ref='add' /&gt;}
        &lt;/div&gt;
  
      );
    }
  })
  </code></pre>
  
  <p>This is where I render it populating one room.</p>
  
  <pre><code>ReactDOM.render(&lt;App&gt;
    &lt;Sidebar rooms={[ { name: 'First Room'} ]} addingRoom={true} /&gt;
    &lt;/App&gt;, document.getElementById('root'));
  </code></pre>
  
  <p>The contents inside the <code>&lt;ul&gt;&lt;/ul&gt;</code> tag don't render at all. Any idea what I could be missing.</p>