jQuery - Cancelling animation at start of function

Question

I have a function that runs after every update:

window.ticker.client.updateData =
    function (data) {
        try {
            if (viewModelOrder.selectedInstrument == data.symbol) {
                viewModelOrder.updatePrice(data.ask.toFixed(5), data.bid.toFixed(5));
            }

            var tr = $("#marketWatchGrid").find("tr:contains('" + data.symbol + "')");
            var bg = '';
            if (data.direction == 1) {
                bg = '154,240,117';
            }
            else {
                bg = '255,148,148';
            }

            tr.find("td:nth-child(2)").html(data.ask.toFixed(5));
            tr.find("td:nth-child(3)").html(data.bid.toFixed(5));

            var current = tr.css('backgroundColor');
            tr.animate({ backgroundColor: 'rgb(' + bg + ')' }, 150)
                .animate({ backgroundColor: current }, 150)
        } catch (e) {
            //console.log("exception: " + e.message);
        }
    }

If the updates are too frequent, naturally the following line gets the background color of tr during the animation started at previous call:

var current = tr.css('backgroundColor');

Because of that, if frequent updates occur, my rows lose their original background color. Is it possible to cancel previously started animation?

Thanks,

Answer 1

Visit Jquery finish to learn about your problem.