why does disabling cache make my webpage work?

Question

I am creating a table with information fetched from two json files. One json file is the schedule where it outlines the time of the event on the rows. The other json file gives me information on what each cell's modal should display. Everything works fine if the table is already hardcoded.

However, I have a function that create the table cells for me. When I load the page, the modals do not appear when the cell is clicked. When refreshed, it works. When refreshed for a second time, it does not work. I tried disabling cache through the network tab in chrome, but I am not sure what the underlying problem is instead of the quick fix with disabling cache. I figured it may have something to do with the resources and how they load. I also tried deferring the script but that still gave me the same problem. Currently I have placed all the script in the bottom of the body tag after those other attempts. I do not want to place a lot of code here but if you do feel it is necessary please let me know. Any ideas?

snippet of table

<div class="tabs">
    <ul class="tabs-list">
        <li class="active"><a href="#tab1">Day 1</a></li>
        <li><a href="#tab2">Day 2</a></li>
        <li><a href="#tab3">Day 3</a></li>
    </ul>
    <div id="tab1" class="tab active">
        <table id="tab01">
            <thead>
                <tr>
                    <th><div class="tzh">Time (ET)</div></th>
                    <th>Track I</th>
                    <th>Track II</th>
                    <th>Track III</th>
                    <th>Track IV</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>

creating table cells before modal activity

 function createTableCells(key, id){
    tab1 = key;
    var tickerValue = tab1.ticker;
    var originalTable = document.getElementById(id).getElementsByTagName('tbody')[0];
    var tr = document.createElement("tr");
    var th = document.createElement("th");
    var td = document.createElement("td");
    $(td).attr("data-ticker", tickerValue);
    td.innerText = tab1.company;
    th.innerText = tab1.start;
    td.classList.add("pres");
    tr.appendChild(th);
    tr.appendChild(td);
    originalTable.appendChild(tr);  
}
    const request = new Request('schedule.json');
    fetch(request, { mode: "no-cors" })
        .then((r)=>{ 
            return r.json(); 
        })
        .then((dataStr)=>{
            dataStr.forEach(function (n, i){
                console.log(Object.keys(n.data));
                    n.data.tab1.forEach(function(tab1) {    
                        createTableCells(tab1, "tab01");
                    });
            });
        });

opening and displaying modal info

window.addEventListener("load", function () {
    var items = document.querySelectorAll("td:not(:empty)")
    assignTickerInfo();
    appendLinkToCellModal();
    items.forEach(function (elem) {
        elem.addEventListener("click", function () {
            showModal('modal1', 'rotate');
        });
    });
});