Display loading screen immediately after button press and before AJAX call is fired

I am trying to display the loading element displayed immediately after the button press and before the AJAX call is made.

Here is my code and what I have tried:-

This code is inside my "on button click" function

$('.loading-container').fadeIn(0);
$('.loading-container').show();
$('.loading-container').css('display', 'block');

console.log("start");

setTimeout(function () {
    getResults();
    console.log("end");
}, 3600);

I have tried the beforeSend as well but it does not display the loading screen immediately after the button click.

The problem is that loading screen shows 4 or 5 seconds after the button click. How can I make it show immediately after the button click?