stop() before a highlight is causing the color to not reset

I have the following:

$('#list_item_title', this).stop().effect('highlight', {color: '#8DD2F7'}, 700);

This occurs when a user tries to submit with 0 input.length. If the user presses enter several times, the highlights stack up 开发者_运维知识库which is why I added stop. Problem now is that the animation stops and the input color is a variation of the highlight color and not the neutral white background.

Any ideas?

stop() accepts some parameters.

.stop( [clearQueue,] [jumpToEnd] )

stop api documentation

You should invoke it in this way:

$('#list_item_title', this).stop(false, true).effect('highlight', {color: '#8DD2F7'}, 700);

By doing so, your color will be changed directly to #8DD2F7 when you stop the animation.