How to change default button color in materialize css?

I have added a button in navbar. Navbar has 4 li elements and 4th contains button. I want to change the default color of the button I want to use custom css.

header.js:

class Header extends Component {

  render() {
    return (
      <div>   
        <div class="navbar-fixed">
          <nav className="navbar">
            <div className="nav-wrapper">
              <a href="#" className="brand-logo">Udacity Logo</a>
              <ul id="nav-mobile" className="right hide-on-med-and-down">
                <li><a href="#">Nanodegree</a></li>
                <li><a href="#">Hire Talent</a></li>
                <li><a href="#">For Business</a></li>
                <li><a className="waves-effect waves-light btn findbtn">Course Finder</a></li>
              </ul>
            </div>
          </nav>
         </div>
      </div>
    );
  }
}

I tried to add following CSS property to .findbtn class but it does not work.

In header.css:

.findbtn{
    background-color: #5E35B1;
}

Screenshot:

Solution

I just tried the code and it works

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  constructor(){
    super()
  }

  render() {
    return (
      <div>   
        <div class="navbar-fixed">
          <nav className="navbar">
            <div className="nav-wrapper">
              <a href="#" className="brand-logo">Udacity Logo</a>
              <ul id="nav-mobile" className="right hide-on-med-and-down">
                <li><a href="#">Nanodegree</a></li>
                <li><a href="#">Hire Talent</a></li>
                <li><a href="#">For Business</a></li>
                <li><a className="waves-effect waves-light btn findbtn">Course Finder</a></li>
              </ul>
            </div>
          </nav>
         </div>
      </div>
    );
  }
}

export default App;

And in CSS file App.css you have to include

.findbtn{
  background-color: #5E35B1;
}

/* if it does not work try with 
background-color: #5E35B1 !important;
may there is some css that is overriding the values */

If it does not work try with !important tag in css may be there is some other class which is not allowing to apply your css