title: Call javascript function from an external HTML file
body: <p>I have made a function inside a separate file from my HTML, I want to call that function when my select value changes, which it does, but it says the function is not defined. From this error: </p>
  
  <p><code>Uncaught ReferenceError: filterByClass is not defined at HTMLSelectElement.onchange (questions:149)</code></p>
  
  <p>This is my HTML where the call is made:</p>
  
  <pre><code>&lt;select id="filter" onchange="filterByClass();"&gt;
      &lt;option value="{}"&gt;{}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>The options don't matter.</p>
  
  <p>And this is my javascript <em>in a separate file</em>:</p>
  
  <pre><code>function filterByClass() {
      const sqlite3 = require('sqlite3').verbose();
      var db = new sqlite3.Database("../sql/homework.db");
      var classId = [];
  
      db.all("SELECT * FROM class WHERE className = ?", [document.getElementById("filter").value], (err, row) =&gt; {
          row.foreach(function (row) {
          classId.push(row.id);
              var questionId = document.getElementsByClassName("question");
              if(row.id != document.getElementById(row.id)) {
                  document.getElementById("filter").style.display = "none";
              }
          });
      });
  
      db.close();
  }
  </code></pre>
  
  <p>I know my code might not be right but that is because I am still learning javascript. </p>
  
  <p>Also, I used <code>browserify</code> to be able to use the require, and turned it into <code>bundle.js</code>.
  And this is the head link to the <code>bundle.js</code>: <code>&lt;script src="bundle.js" type="text/javascript"&gt;&lt;/script&gt;</code>.</p>
  
  <p>This is the first time I have used javascript in a separate file by the way, since I usually just put the code in the head directly.</p>