fetch_planets.html

<!DOCTYPE html>
<html>
   <head>
      <title>Fetch Planets</title>
      <script>
         window.addEventListener("load", function() {
            let json = [];
            fetch("https://handlers.education.launchcode.org/static/planets.json").then(function(response) {
                response.json().then(function(json) {
                const destination = document.getElementById("destination");
                let index = 0;
                destination.addEventListener("click", function(){
                destination.innerHTML = `
                    <div>
                     <h3>Planet ${json[index].name}</h3>
                    <img src=${json[index].image} height=250></img>
                    </div>
                    `;
            index = (index + 1) % json.length;
                });
            });
          });
            });
      </script>
   </head>
   <body>
      <h1>Destination</h1>
      <div id="destination">
         <h3>Planet</h3>
      </div>
   </body>
</html>