jQuery: запустить метод, связанный с css ПОСЛЕ завершения предыдущего метода css

Question

Я делаю следующее через jQuery, но похоже, что они почти происходят одновременно.

Есть ли способ убедиться, что itemNameContainer.removeClass ('NoDisplay') в полном обратном вызове запускается только послеloadingContainer.addClass ('NoDisplay') завершен?

Визуально это выглядит так, как будто я вижу «Пожалуйста, подождите ..», и имя элемента отображается одновременно ..

function onToggleItemCompletionStatus(currentItem) {
    var itemId, toggle = !currentItem.Completed,
        loadingContainer, itemNameContainer;
    itemId = currentItem.ItemId;
    loadingContainer = $('#loading_' + itemId);
    itemNameContainer = $('#name_' + itemId);

    $.ajax({
        beforeSend: function (xhr, settings) {
            loadingContainer.removeClass('noDisplay');
            itemNameContainer.addClass('noDisplay');
        },
        complete: function (xhr, textStatus) {
            loadingContainer.addClass('noDisplay');
            itemNameContainer.removeClass('noDisplay');
        },
        data: {
            accessToken: aToken,
            listId: currentGroceryList.Id,
            itemId: currentItem.ItemId,
            completed: toggle
        },
        dateType: 'json',
        error: function (xhr, textStatus, errorThrown) {
            $.publish(customEvent.ItemToggledFail, [currentItem]);
        },
        success: function (data, textStatus, xhr) {
            var success = data.success;

            if (success) {
                $.publish(customEvent.ItemToggledSuccess, [currentItem]);
            } else {
                $.publish(customEvent.ItemToggledFail, [currentItem]);
            }
        },
        type: 'POST',
        url: actionUrls.toggleItemCompletionStatus
    });
}

РЕДАКТИРОВАТЬ Я вставил фактическую функцию, чтобы дать лучшую идею

Answer 1

Не то чтобы я знал, но вы могли бы попробовать ...

loadContainer.fadeOut(300, function() {
   itemNameContainer.removeClass('NoDisplay');
});