Сохранение в localStorage на клик

Не очень понимаю, как нужно сохранить данные в localStorage, чтобы те загружались на клик, а не просто сразу со всем сайтом. Я пробовал вставить фунцкцию "сonst jsonString = JSON.stringify(coins); // localStorage.setItem("myCoins", jsonString" в function displayCoins(coins), но он все равно грузит сразу все с ajax ;

 loadFromStorage()

    function loadFromStorage() {
    
        const jsonString = localStorage.getItem("myCoin");
        if (jsonString) {
            coins = JSON.parse(jsonString);
        }
    }


    async function handleCurrencies() {
        const coins = await getJson("https://api.coingecko.com/api/v3/coins");
        displayCoins(coins);
    }
    
    function displayCoins(coins) {
        let html = "";
        for (const coin of coins) {
            html += `
                <div class="card">
                    ${coin.symbol}
                    <br>
                    ${coin.name}
                    <br>
    
                    <button class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#${coin.id}">
                        More Info
                    </button>
                    <div class="collapse" id="${coin.id}">
                        <div class="card-body">
                            <img src="${coin.image.small}">
                            ${coin.market_data.current_price.usd}$
                            <span> | </span>
                            ${coin.market_data.current_price.eur}€
                            <span> | </span>
                            ${coin.market_data.current_price.ils}₪
                        </div>
                    </div>
    
                </div>
            `;
        }
        contentDiv.innerHTML = html;

const jsonString = JSON.stringify(coins);
     localStorage.setItem("myCoins", jsonString);
    }
    
    async function getJson(url) {
        const response = await fetch(url);
        const json = await response.json();
        return json;
    }

Ответы (0 шт):