I want the loader to stay until the complete execution is complete and statement $("#xyzDiv").html(data) has been executed. Currently the loader gets hidden after the first ajax call. Even if i add "beforeSend: function () { $("#loader").show(); }" to GetDataList(), the loader is not staying.

$.ajax
({
    type: "POST",
    url: ajaxUrl,
    data: dataObj,
    beforeSend: function () { $("#loader").show(); },
    success: function (data)
    {
        if (data.result)
        {
            GetDataList();
            toastr.success(data.strMsg);
        }
        else
        {
            toastr.error(data.strMsg);
        }
    },
    error: function (jqXHR, textStatus)
    {
         var msg = HandleAjaxErrorMessage(jqXHR, textStatus);
        console.log(msg);
        toastr.error('An error occurred. Please try again');
    },
    complete: function () { $("#loader").hide(); }
});

function GetDataList()
{
    $.ajax
    ({
        type: "Get",
        url: ajaxUrl,
        data: dataObj,
        success: function (data)
        {
            $("#xyzDiv").html(data);
        },
        error: function (jqXHR, textStatus) 
        {
            var msg = HandleAjaxErrorMessage(jqXHR, textStatus);
            console.log(msg);
            toastr.error('An error occurred. Please try again');
        }
    });
}