title: Uncaught TypeError: Cannot set property 'onclick' of null
body: <p>I am creating an HTML page, Which is built using bootstrap. Here is the final HTML code and code of hello.js file:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>document.getElementById("subm").onclick = function () {
    alert("Hello WOrld");
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Calculator&lt;/title&gt;
    &lt;link rel="stylesheet" href="/stylesheets/style.css"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  &lt;/head&gt;
  &lt;/html&gt;
  &lt;body&gt;
    &lt;link rel="stylesheet" href="/stylesheets/bootstrap.min.css"&gt;
    &lt;script src="http://code.jquery.com/jquery.js"&gt;&lt;/script&gt;
    &lt;script src="javascripts/bootstrap.min.js"&gt;&lt;/script&gt;
    &lt;script src="javascripts/hello.js"&gt;&lt;/script&gt;
    &lt;h1&gt;Calculator&lt;/h1&gt;
    &lt;form class="form-horizontal center1"&gt;
      &lt;div class="control-group"&gt;
        &lt;label for="num1" class="control-label"&gt;Number1&lt;/label&gt;
        &lt;div class="controls"&gt;
          &lt;input id="num1" type="number" placeholder="Enter an Integer"&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="control-group"&gt;
        &lt;label for="num2" class="control-label"&gt;Number2&lt;/label&gt;
        &lt;div class="controls"&gt;
          &lt;input id="num2" type="number" placeholder="Enter an Integer"&gt;
        &lt;/div&gt;
        &lt;div class="control-group"&gt;
          &lt;label for="options" class="control-label"&gt;Options&lt;/label&gt;
          &lt;div class="controls"&gt;&lt;br&gt;
            &lt;select id="options"&gt;
              &lt;option value="+"&gt;+&lt;/option&gt;
              &lt;option value="-"&gt;-&lt;/option&gt;
              &lt;option value="*"&gt;*&lt;/option&gt;
              &lt;option value="/"&gt;/&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="control-group"&gt;
          &lt;div class="controls"&gt;&lt;br&gt;
            &lt;button id="subm" type="submit" class="btn"&gt;Calculate&lt;/button&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="control-group"&gt;
          &lt;div class="controls"&gt;
            &lt;input id="cal" type="text" placeholder="Calculator output" disabled="true"&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/form&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When I click on the button using submit then instead of alert I am getting error </p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot set property 'onclick' of null </p>
  </blockquote>
  
  <p>Can anyone please tell me why I am facing this error?? Help to resolve it.</p>