index.html

<html>
  <head>
    <!--
      Get jQuery via CDN (https://jquery.com/)
      jQuery is a js framework that gives us some easy to use
      functions for interacting with webpages and APIs
    -->
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

    <!-- Load our files -->
    <script type="text/javascript" src="index.js"></script>
    <link rel="stylesheet" type="text/css" href="index.css">
  </head>

  <body>
    <!-- TODO: Say something interesting in the heading tag... -->
    <h1>Hello World</h1>

    <div class="purple">
      <span>This text should be purple</span>
    </div>

    <button>Show me some animal trivia!</button>

    <div id="results-area"></div>
    <div id="question-display"></div>
    <div id="answer-display"></div>
  </body>
</html>