Почему я не могу переключить курсор на прогресс до выполнения какого-либо скрипта в jQuery?

Я изо всех сил пытался понять, что я здесь делаю не так. Я просто пытаюсь изменить курсор на «прогресс» с помощью функции jQuery .css() после того, как пользователь нажимает кнопку, но перед циклическим переходом через серию в HighStock (выполнение которой занимает пару секунд) и отображение / скрытие некоторых строк (32 из них !).

Я пробовал много вещей, но что бы я ни пробовал, он просто останавливает кнопку в положении «вниз» (не меняя курсора, но вы все равно можете перемещать его) до тех пор, пока код не будет завершен.

Вот что я пробовал (по порядку):

Примечание. Все мои попытки дают одни и те же результаты (т. е. ошибок не возникает, код выполняется, но я никогда не получаю курсор "прогресс", который отображается, пока код занят. выполнено.

$("#onAllOverall").click(function () {
    $("body").css("cursor", "progress");

    for (var s = 0; s < series.length; s++) {
        series[s].hide();
    }

    $("body").css("cursor", "default");
});

Итак, я попробовал:

$("#onAllOverall").click(function () {
    $("body").css("cursor", "progress");
}

$("#onAllOverall").click(function () {
    for (var s = 0; s < series.length; s++) {
        series[s].hide();
    }

    $("body").css("cursor", "default");
});

Я даже дошел до того, что попробовал:

function progressCursor() {
    $("body").css("cursor", "progress");
}

$("#onAllOverall").click(function () {

    $.when(progressCursor).done(function () { //also tried $.when.then(), but I admit I don't know much about these methods;
        for (var s = 0; s < series.length; s++) {
            series[s].show();
        }
    });

    $("body").css("cursor", "default");
});

Я помню, как пробовал еще пару вещей, но не могу точно вспомнить, что они были, но они были простыми и бесполезными.

Я чувствую себя глупо, что здесь ничего не работает. Что я делаю неправильно?