JSFiddle - React, Tailwind, and code Playground

HTML

<button id="show">Show</button>
<div id="display"></div>

JavaScript

var input = '1 2 3 4 5 6 7 8 9 10';
var search = input.split(' ');
var link = new Array();
var j = 0;
var clicked = 0;

$(document).ready(function () {
    callAjax(j);

    $('#show').click(function () {
        $('#display').html("Your data is being fetched");
        clicked = 1;        
    });

});

function callAjax(index) {
    var look = new URL('https://ajax.googleapis.com/ajax/services/search/images?v=1.0&q=' + index + '&callback=?');
    $.ajax({
        url: look,
        dataType: 'json',
        async: false,
        success: function (data) {            
            link[j] = (data.responseData.results[0].url);
            j++;
            if(j < search.length - 1) {
                callAjax(j);
            } else {
                $('#show').click(function () {
                    $('#display').empty();
                    $.each(link, function (key, value) {
                        $('#display').append(value + '<br>');
                    });
                });
                if(clicked == 1) {
                    $('#show').trigger('click');
                }                
            }            
        }
    });    
}