I'm new to JS and am trying to get a value from inside of the array.

In the console I enter:

assetList[0].data[0].id 

and I get back the value as I expect to, however when I try to pass the value into a variable in my actual JS script as per below:

function getAssetList() {

var myHeaders = new Headers();  
myHeaders.append("Authorization", "Basic 12345678==");

var requestOptions = {
  method: 'GET',
  headers: myHeaders,
  redirect: 'follow'
};
assetList.pop(); //remove the existing data from the array first otherwise it will keep adding assset lists to the array
fetch("https://api.mux.com/video/v1/assets", requestOptions)
  .then(response => response.json())
  .then(data => assetList.push(data))
  .catch(error => console.log('error', error));

  let assetListData = assetList[0].data[0].id;

  // find the unordered list in the HTML
   let assetListContents = document.getElementById("assetListContents");
   //get the length of the array
   let arrayLength = 25 //assetList[0].data.length;
   //use a loop to go through array and add 
      
  for( let i=0; i < arrayLength; i++) {
      let listItem = document.createElement("li");
      listItem.innerHTML = assetListData;
      assetListContents.append(listItem);
  }

};

I get an error back, Uncaught TypeError: Cannot read properties of undefined (reading 'data')

The error happens at "let assetListData = assetList[0].data[0].id;" What am I doing wrong here? Thanks for your help!