Переход цвета фона Javascript и сброс при ответе HTTP

Я делаю запрос POST на сервер, используя ajax из Firefox. Входные данные — это просто некоторая текстовая запись в поле, содержащемся внутри div:

<div id = "mydiv">
    ...stuff...
</div>

Если запрос выполнен успешно, я вызываю обработчик, чтобы отразить этот статус. Если запрос ошибочен, я вызываю другой обработчик.

$.ajax({
    type: 'POST',
    data: my_json,
    dataType: "json",
    url: "/my/url",
    success: function(result, status, xhr) {
        success_callback();
    },
    error: function(xhr) {
        error_callback();
    }

});

Обратный вызов успеха мало что делает. В обратном вызове ошибки я хочу изменить атрибут цвета фона на красный, чтобы визуально указать на ошибку, а затем вернуться к исходному цвету фона (скажем, белому).

Мгновенное изменение цвета очень просто:

function success_callback() {

    var element = document.getElementById('mydiv');
    element.style.backgroundColor = "white";

}

function error_callback() {

    var element = document.getElementById('mydiv');
    element.style.backgroundColor = "red";

}

Я пытался сделать затухание с помощью анимации css, такой как

CSS

.div.error {
     -webkit-animation-duration: 3s;
     -webkit-animation-name: error;
     animation-duration: 3s;
     animation-name: error;
} 
@-webkit-keyframes error {
    from {
        background-color: red;
    }
    to {
        background-color: white;
    }
}

а затем добавить класс ошибки в JavaScript:

JS

function error_callback() {

    if ($('.div').hasClass('error')) {
        $('.div').removeClass('error');
    else {
        $('.div').addClass('error');
    }
}

Это работает в первый раз, когда я отправляю неверный POST-запрос, но не работает при последующих неверных POST-запросах, потому что я не думаю, что removeClass работает правильно (или, скорее, я неправильно его использую).

Я также пытался использовать jquery-ui после этого сообщения CSS-переход: затухание цвета фона, сброс после, но, похоже, это не работает для меня. Возможно, это как-то связано с выполнением анимации в контексте нажатия кнопки, а не ответа HTTP?

Я иду в правильном направлении для использования этого? Я хотел бы, если возможно, не выходить за рамки стандартного jQuery (т.е. держаться подальше от пользовательского интерфейса jQuery).