Pseudo-elements are not really part of browser DOM - so they can't be targeted directly by JQuery.
only works because JQuery is using the CSS pseudo selector :first
to evaluate and return an actual DOM element.
To achieve desired effect, you should actually look at using http://api.jquery.com/toggleclass/
I totally get why you were thinking you could alter use .css() to manipulate the .hvr-underline-from-left:before.
Hope this helps out!