title: Cannot get JavaScript to work in an HTML webpage when it is a separate .js file
body: <p>I've been whacking away at this for like 2 days with no luck. I'm trying to learn JavaScript and I'm working my way through this book. My HTML code is very simple, it's as follows:</p>
  
  <pre><code>&lt;/head&gt;
  &lt;body&gt;
      &lt;input type="button" value="Click" onclick="alert(calcTot(48.21));" onmouseover="this.style.color = 'green';"&gt;
  
      &lt;form&gt;
          ZIP:&lt;br /&gt;
          &lt;input type="text" id="zip" onblur="fillCity();" /&gt;&lt;br /&gt;
          City:&lt;br /&gt;
          &lt;input type="text" id="city" /&gt;
      &lt;/form&gt;
  
      &lt;script&gt;src="JavaScript_Practice.js"&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I've got 2 separate functions I wrote in a separate .js file, they are as follows:</p>
  
  <pre><code>function calcTot(merchTot) {
      var orderTot;
      if (merchTot &gt;= 100) {
          orderTot = merchTot;
      }
      else if (merchTot &lt; 50.01) {
          orderTot = merchTot + 5;
      }
      else {
          orderTot = merchTot + 5 + merchTax(merchTot);
      }
  
      function merchTax(merchTot) {
  
          var taxTot = (0.03 * (merchTot - 50))
  
          return taxTot
      }
  
      return orderTot.toFixed(2);
  }
  
  
  function fillCity() {
      var cityName;
      var zipEntered = document.getElementById("zip").value;
      switch (zipEntered) {
          case "60608":
              cityName = "Chicago";
              break;
          case "68114":
              cityName = "Omaha";
              break;
          case "53212":
              cityName = "Milwaukee";
      }
      document.getElementById("city").value = cityName;
  }
  </code></pre>
  
  <p>The files are in the same folder, and I've tried completely specifying the path to the .js file in the HTML file as well. I've also tried specifying the type as "text/JavaScript", but to no avail. When I press F12 and to try click my buttons/enter values in the fields, I get the following Errors: </p>
  
  <pre><code>SCRIPT5009: SCRIPT5009: 'calcTot' is not defined
  
  0: 'fillCity' is not defined
  </code></pre>
  
  <p>JavaScript is enabled on IE, and I've tried this on IE, Chrome, and Firefox. It doesn't work on any of them.</p>
  
  <p>When I hard-code the functions inside the .html file, the functions work just fine. Lastly, I've tried uploading the file onto GitHub and referencing it from there and it also doesn't work. I feel like it must be something small and simple that I don't know about, any help would be greatly appreciated.</p>