присвоение переменной внутри ajax успешный вызов не работает

Question

Я пытаюсь собрать данные из ajax запроса от группы URL-адресов, выполняя что-то вроде этого:

        let allData = [];

        let dataURL = [];

        $('.pagn .pg').each(function(){
            if($(this).attr('data-url')){
                dataURL.push("https://www.myweb.com/" + $(this).attr('data-url'));
            }
        })

        //dataURL.shift() //Remove first item from array
        dataURL.splice(dataURL.length-1,1); //Remove last item from array
        console.log(`COLLECTED URL`)
        console.log(dataURL)

        for(let i = 0;i<dataURL.length;i++){
            console.log(`Inside Loop`)
            getAndPopulateData(dataURL[i],i)
        }

        function getAndPopulateData(dataUrl,removeIndex){
            console.log(`Inside Ajasx`)
            $.ajax({
                type:"GET",
                url:dataUrl,
                success:function(data){
                    console.log(`Ajax successful`)
                    console.log(data.data.items)

                    allData.push(data.data.items)
                    dataURL.splice(removeIndex,1);
                    if(dataURL.length == 0){
                        console.log(`All elements have been removed`)
                    }
                }
            })
        }

Я вижу данные в моей консоли, поступающие с console.log(data.data.items), что занимает около 2 секунды, чтобы появиться. Но когда я проверяю переменную allData, это просто пустой массив. Разве все внутри функции успеха не должно обрабатываться синхронно?