jQuery добавить Class при клике и удалить Class когда клик снова

HTML

<a rel="nofollow" href="#" data-quantity="1" data-product_id="154" data-product_sku="39037" class="button product_type_simple add_to_cart_button "><i class="fa fa-shopping-cart" aria-hidden="true"></i><i class="fa fa-fa-check-square-o hidden" aria-hidden="true"></i></a>

CSS

.box {
  width: 250px;
  height: 100px;
  border: 1px #000 solid;
}

.red {
  background: red;
}

.blue {
  background: blue;
}

.button {
  background-color: #ff0980;
  border-radius: 4px;
  font-weight: 500;
  padding: 10px 20px;
  display: inline-block;
  line-height: 20px;
  border: none;
  font-size: 14px;
  color: #000;
  transition: all .3s ease;
}

JavaScript

$('.button').on('click', function() {
  $('html,body').animate({scrollTop:$('.reviews').offset().top+"px"},{duration:1E3});
});