I'm trying to iterate over the result of an array, but it's not working. Each result can have up to 20 results. I'm getting it three times, but I can't iterate through each of the 60 results

     var responses = [];
     var url = "http://api.crossref.org/works?filter=prefix:10.5090,from-created-date:2020,until-created-date:2020";
   
    async function doAjax(args) {
    const result = await $.ajax({
        url: url,
        type: 'GET',
        data: args
    });

    return result;
    }
    
    const stuff = doAjax('cursor=*').then((data) => {
        responses.push(data.message.items);
        var totalresults = data.message['total-results'];
        var cursor = 'cursor='+data.message['next-cursor'];

        if (totalresults > 20) {
            for (var i = 1; i <= 2; i++) {
                var selector = '' + i;
                selector = 'responses' + selector;
                selector = data.message.items;

                $.when(doAjax(cursor)).done(function(selector){
                    responses.push(selector.message.items);
                })
            }
        }
        console.log(responses);
        $.each(responses, function(index,value){
            console.log(value.DOI); // this line returns undefined
        })
    });