How to change color of button material UI tag on react js after clicked?

class Test extends React.Component {
    constructor(){
        super();

        this.state = {
           red: true
        }
    }

    changeColor(){
       this.setState({red: !this.state.red})
    }

    render(){
        let btn_class = this.state.red ? "redButton" : "blackButton";

        return (
             <button className={btn_class} onClick={this.changeColor.bind(this)}>
                  Button
             </button>
        )
    }
}

React.render(<Test />, document.getElementById('container'));