How do I programmatically change CSS class rules

I have the following CSS and need to programmatically update it after clicking a button but I cannot figure out how.

This is the initial CSS

.hoverable:hover {
  color: red;
}

I need the class to have the following CSS after clicking the button.

.hoverable:hover { 
  color: blue;
}