Foundation Button After Click

Question

I am using the Foundation Framework in my React app. I have a couple buttons and after being clicked it leaves the buttons with a blue background.

How do I change this?

JSFiddle -> http://jsfiddle.net/pb4759jh68/a4kowth5/5/

HTML

<button class="button">
Click Me
</button>

CSS

.button {
  background-color:red;
}

.button:hover {
  background-color:green;
}

Answer 1

It looks like foundation has a CSS class that is active during the button's Focus state.

You can override this with using the following CSS class:

.button:focus {
     background-color: green;
}