title: How to remove elements?
body: <p>I created an example of my problem in jsfiddle, when I click the minus symbol it always seems to remove the last element in the list.</p>
  
  <p>Steps to reproduce:</p>
  
  <ul>
  <li>Press add 3 times</li>
  <li>Select different options in each</li>
  <li>press middle minus button</li>
  </ul>
  
  <p>The last one is always deleted, expected behaviour is that the dropdown inline with the minus button is removed.</p>
  
  <p>html</p>
  
  <pre><code>&lt;!-- index.html --&gt;
  &lt;!DOCTYPE html&gt;
  &lt;title&gt;React Tutorial&lt;/title&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"&gt;&lt;/script&gt;
  &lt;body&gt;
  &lt;div id="content"&gt;&lt;/div&gt;
  &lt;script src="main2.jsx" type="text/babel"/&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>jsx</p>
  
  <pre><code>var ConditionGroup = React.createClass({
  
      makeId: function () {
          return Math.floor((Math.random() * 10000000000000) + 1);
      },
  
      getInitialState: function () {
          return {conditionNodes: []};
      },
  
      removeCondition: function(condition) {
          let res = [];
          console.log(condition);
          console.log(this.state.conditionNodes);
          for (var i = 0; i &lt; this.state.conditionNodes.length; i++) {
              if (this.state.conditionNodes[i].props.id !== condition.props.id) {
                  console.log('beep');
                  res.push(this.state.conditionNodes[i]);
              }
          }
          console.log(res);
  
          this.setState({conditionNodes: res});
      },
  
      handleAddCondition: function (e) {
          e.preventDefault();
  
          var conditionNodes = this.state.conditionNodes;
          conditionNodes.push(
              (
                  &lt;Condition removeCondition={this.removeCondition} id={this.makeId()}/&gt;
              )
          );
  
          this.setState({conditionNodes: conditionNodes});
      },
  
      render: function () {
          return (
              &lt;div className="conditionGroup"&gt;
                  {this.state.conditionNodes}
  
                  &lt;br/&gt;
                  &lt;input onClick={this.handleAddCondition} type="button" value="Add"/&gt;
              &lt;/div&gt;
          )
      }
  });
  
  var Condition = React.createClass({
      conditions: [
          {id: "STATE", name: "State"},
          {id: "PATTERN_MATCH", name: "Pattern Match"},
          {id: "GREATER_THAN", name: "Greater Than"},
          {id: "LESS_THAN", name: "Less Than"},
          {id: "EQUAL_TO", name: "Equal To"},
          {id: "IS_TRUE", name: "Is True"}
      ],
  
      getInitialState: function () {
          return {selectValue: "STATE"}
      },
  
      handleRemoveAction: function (e) {
          e.preventDefault();
          this.props.removeCondition(this);
      },
  
      onChange: function (e) {
          this.setState({selectValue: e.target.value})
      },
  
      render: function () {
          var conditionOptions = this.conditions.map(function (condition) {
              return (
                  &lt;option value={condition.id}&gt;{condition.name}&lt;/option&gt;
              )
          });
  
          return (
              &lt;div class="condition"&gt;
                  &lt;select onChange={this.onChange} value={this.state.selectValue}&gt;
                      {conditionOptions}
                  &lt;/select&gt;
  
                  &lt;input onClick={this.handleRemoveAction} value="-" type="button"/&gt;
              &lt;/div&gt;
          )
      }
  });
  
  ReactDOM.render(
      &lt;ConditionGroup/&gt;,
      document.getElementById('content')
  );
  </code></pre>
  
  <p><a href="https://jsfiddle.net/sd3h7g3v/" rel="nofollow">https://jsfiddle.net/sd3h7g3v/</a></p>