title: Document Undefined
body: <p>I have node js running a server that loads an html file with express. This html file has javascript that hides and shows a picture on the page with a button. I want to use the same function to hide  and show the picture without the need for a button by calling the method in the main.js file that contains the rest of the application code. However, whenever I call the method it gives me a document not defined error. The button that calls the same function when clicked works however. I am not sure what the problem is (new to node).</p>
  <p>web.js:</p>
  <pre><code>const hider = require(&quot;./public/script&quot;);
  
  function site(){
      const express = require('express');
      const path = require('path');
  
      const port = 3000;
  
      const app = express();
  
      app.use(express.static(path.join(__dirname, 'public')));
  
      app.listen(port, () =&gt; console.log(&quot;Server Started on: 127.0.0.1:&quot;+port));
  };
  
  function hidePic(){
      hider.hide();
  }
  
  
  module.exports = { site , hidePic}
  </code></pre>
  <p>File loaded by express. The button to hide the image works.</p>
  <p>index.html:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
  &lt;head&gt;
      &lt;meta charset=&quot;UTF-8&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
      &lt;title&gt;Document&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;button onclick=&quot;hide()&quot;&gt;Try it&lt;/button&gt;
  
      &lt;div id=&quot;picture1&quot;&gt;
          &lt;img src=&quot;img.jpg&quot; alt=&quot;img&quot;&gt;
      &lt;/div&gt; 
  
      &lt;script src=&quot;script.js&quot;&gt;&lt;/script&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  <p>script.js:</p>
  <pre><code>function hide() {
      var x = document.getElementById(&quot;picture1&quot;);
      if (x.style.display === &quot;none&quot;) {
        x.style.display = &quot;block&quot;;
      } else {
        x.style.display = &quot;none&quot;;
      }
  }
  
  module.exports = { hide }
  </code></pre>
  <p>Main program</p>
  <p>main.js:</p>
  <pre><code>const web = require(&quot;./website&quot;)
  
  web.site();
  
  web.hidePic(); //Want this to hide picture in on webserver from within this file
  </code></pre>