<div id="app">Loading latest stories...</div>

<script async>

  // Variables
  let elem = document.querySelector('#app');

  // Methods
  // ---Get the arrays and call updateDOM
  function callNYT() {
    fetch('https://api.nytimes.com/svc/topstories/v2/home.json?api-key=V4DAxXaiDzvGkumnpxfO4LpmCd7dM9om').then(function (response) {
      if (response.ok) {
        return response.json();
      } else {
        return Promise.reject(response);
      }
    }).then(array => updateDOM(array.results))};
  // ---Helper function to insert the newest 5 as list items in the DOM
  function updateDOM(storiesArray) {
    let top5 = storiesArray.slice(0, 5);
    let stories = top5.map(function (story) {
      return `<li><a href="${story.short_url}">${story.title}</a></li>`;
    }).join('');
    elem.innerHTML = `<ul>${stories}</ul>`;
  }

  // Inits
 callNYT();

</script>