Adding React Components with Button Clicks

DynamicReactComponents.js

var React = require('react');

var OpenResponse = React.createClass({
  render: function() {
    return (
      <div>
        Open Response
      </div>
    )
  }
});

var New = React.createClass({

  getInitialState: function() {
    return {
      myArr: [{id:1, name: "Some name"}]
    }
  },

  addChild: function() {
    this.setState({
      myArr: this.state.myArr.concat([{id:2, name:"other name"}])
    })
  },

  render: function() {
    return(
      <div>
        <button onClick={this.addChild}>Add Component</button>
        {
          this.state.myArr.map(function(item) {
            return <OpenResponse key={item[0].id} />
          })
        }
      </div>
    )
  }
});

Using destructuring and arrow functions would make it even better than that, in my opinion.

const { myArr } = this.state;
const items = myArr
  .map(i => <OpenResponse key={i.id} />);