title: API Images not displaying and cards not dynamically populated
body: <p>I am trying to display Unsplash images on cards.</p>
  <p>The cards are created using JavaScript.</p>
  <p>The 10 objects from the Unsplash API is shown on the console.</p>
  <p>However, I cannot seem to find the problem on why the cards and the API Unsplash images are not displaying.</p>
  <p>Appreciate any help, thanks.</p>
  <pre><code>const resultsNav = document.getElementById('resultsNav');
  const favouritesNav = document.getElementById('favouritesNav');
  const imagesContainer = document.querySelector('.images-container');
  const saveConfirmed = document.querySelector('.saveConfirmed');
  const loader = document.querySelector('.loader');
  
  
  // Unsplash API
  const count = 10;
  const apiKey = 'DEMO KEY';
  const apiUrl = `https://api.unsplash.com/photos/random?client_id=${apiKey}&amp;count=${count}`;
  
  let resultsArray = [];
  
  function updateDOM() {
    resultsArray.foreach((result) =&gt; {
      // Card Container
      const card = document.createElement('div');
      card.classList.add('card');
      // link
      const link = document.createElement('a');
      link.href = result.hdurl;
  
      //Images
      const image = document.createElement('img');
      image.src = result.url;
      image.alt = 'Image';
      image.loading = 'lazy';
      image.classList.add('card-img-top');
      //Card Body
      const cardBody = document.createElement('div');
      cardBody.classList.add('card-body');
      // Save Text
      const saveText = document.createElement('p');
      saveText.classList.add('clickable');
      saveText.textContent = 'Add To Favourites';
  
      // Append
      cardBody.append(saveText);
      link.appendChild(image);
      card.append(link, cardBody);
      imagesContainer.appendChild(card);
    });
  }
  
  //  Get 10 Images from Unsplash API
  async function getUnplashPictures() {
    try {
      const response = await fetch(apiUrl);
      resultsArray = await response.json();
      console.log(resultsArray);
      updateDOM();
    } catch (error) {
      // Catch Error Here
    }
  }
  
  // On Load
  getUnplashPictures();
  </code></pre>