How to use a CSS class with the jQuery Bootstrap4 effect

How to use a CSS class with the jQuery Bootstrap4 effect

So i'm using jquery effect to put a highlight in certain situations. It looks something like this

  1. $("#spanAdultCount").effect("highlight", { color: "#008000" }, 3000);
I'd like to have the color used be from scss.  I've tried replacing the {color:"#008000")} with 

  1. function () { $(this).addClass("shannon") }
and shannon looks like this
  1. .shannon{    color:pink}
but that doesn't change the background color to pink, instead it changes the text to pink and it never goes away.  with the hardcoding of color:#008000 the text stays black and the background changes to green, then it goes away.

So again i'm just trying to figure out how to not have to hard code it.  any help would be great.
thanks