title: Undefined method in react.js
body: <p>I've binded all of my methods in the constructor to my class.
  One of them is not working properly, the console logs an undefined error. It is executed in a function, but I previously declared it's this keyword as a class. I can not spot the problem. The <strong>handleRemove</strong> is the method, I'm talking about. </p>
  
  <pre><code>import React, { Component } from 'react';
  
  
  class ToDoList extends Component {
    constructor(props) {
      super(props);
      this.state = {list: [], items: ''};
      this.handleChange = this.handleChange.bind(this);
      this.handleSubmit = this.handleSubmit.bind(this);
      this.handleRemove = this.handleRemove.bind(ToDoList);
    }
  
    handleChange(event) {
      this.setState({items: event.target.value})
      console.log(event.target.value);
    }
  
    handleSubmit(event) {
      this.setState({ list: [...this.state.list, this.state.items]})
      event.preventDefault();
    }
  
    handleRemove(event) {
      const filteredArray = this.state.list.filter(item =&gt; item !== event.target.value)
      this.setState({list: filteredArray});
    }
  
  
  
    render() {
      return (
      &lt;div&gt;
        &lt;form onSubmit={this.handleSubmit}&gt;
          &lt;label&gt;
            &lt;input type="text" value={this.state.value} onChange={this.handleChange} /&gt;
          &lt;/label&gt;
          &lt;input onClick={this.handleSubmit}type="submit" value="Submit" /&gt;
        &lt;/form&gt;
        &lt;ul&gt;
          {this.state.list.map(function(i, index){
            return(
              &lt;li key={index}&gt;{i}&lt;button onClick={this.handleRemove}&gt;X&lt;/button&gt;&lt;/li&gt;
            )
          })}
        &lt;/ul&gt;
        &lt;p&gt;Remaining: {this.state.list.length}&lt;/p&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default ToDoList;
  </code></pre>