JSFiddle - React, Tailwind, and code Playground

by akang2

HTML

<!doctype html>
 <html lang="en">
  <head>
      <title>Temperature</title>
      <meta charset = "utf-8">
      <script>
          
        window.onload = showTemps;
          
          function showTemps(){
          
           var theHour = new Array();
           theHour[0] = 59;
           theHour[1] = 60;
           theHour[2] = 61;
           theHour[3] = 62;
          
          for (var i = 0; i < theHour.length; i++){
          
          var hourTemps = theHour[i]; <!-- Why is it a good idea to assign a variable to this when I can just use "theHour[i]" ?? -->
           var id = "temp" + i;
           var li = document.getElementById(id);

          if (i==0) {
          li.innerHTML = "At noon the value is " + theHour[i];
          }
          else {
           li.innerHTML = "At " + i + " the value is " + theHour[i];
          }
          }
          }
          
          
         </script>
</head>
<body>
    <br>
    <form>
        <input type = "text" id = "song" size = "20" placeholder = "dis heah nigguh">
        
        <input type = "button" id = "clickity" value = "fo sho">
    </form>
    
    <br>
    
<h1>Temperatures</h1>
<ul>
    <li id="temp0"></li>
    <li id="temp1"></li>
    <li id="temp2"></li>
    <li id="temp3"></li>
    <li id="temp4"></li>
</ul>
</body>
</html>

CSS

#clickity {
    padding: 5px;
}

JavaScript

//Head First HTML5 Ch 2 Ask Chris