I am fascinated by both American football and APIs, so I am learning how to make a football database. As of now I am attempting to print a simple list of the NFL’s teams and their win/loss record, given the input of a year. Here is my script.js file:

const apiKey = "my api key. idk if i am allowed to post it publicly so i'm not going to";
const standingsUrl = "https://api.sportsdata.io/v3/nfl/scores/json/Standings/%7B";
const searchBox = document.querySelector(".search input");
const searchBtn = document.querySelector(".search button");
const testTable = document.getElementById("test-table");

//I know its called test-table but it's just a ul element that I want to print the list into.

async function checkYearStandings(year){
    const response = await fetch(standingsUrl + year + `%7D?key=${apiKey}`);

    var data = await response.json();

    console.log(data);

/* for..of code to print the list goes here */


}

searchBtn.addEventListener("click", ()=>{
    checkYearStandings(searchBox.value);
})

checkYearStandings();

At this point I was elated to see that the correct table would print in my console log… the following for..of loop is the closest I’ve come to printing the correct information. So far I get 32

    for(let a of data) {
        a = document.createElement("li");
        a.innerHTML = "Team: " + data.Name + ", " + data.Wins + " wins and " + data.Losses + " losses";
        testTable.appendChild(a);
    }