title: Uncaught ReferenceError: <function> is not defined at HTMLButtonElement.onclick
body: <p>I have created my problem on JSFiddle at <a href="https://jsfiddle.net/kgw0x2ng/5/" rel="noreferrer">https://jsfiddle.net/kgw0x2ng/5/</a>. The code is as follows</p>
  
  <p><strong>HTML CODE</strong> </p>
  
  <pre><code>&lt;div class="loading"&gt;Loading&amp;#8230;&lt;/div&gt; 
  &lt;button type="submit" onClick="hideButton()"&gt;Hide&lt;/button&gt;
  &lt;button type="submit" onClick="showButton()"&gt;Show&lt;/button&gt;
  </code></pre>
  
  <p><strong>JS CODE</strong></p>
  
  <pre><code>function hideButton(){
     $(".loading").hide();
  }
  function showButton(){
     $(".loading").show();
  }
  </code></pre>
  
  <p>I am showing a spinner and I would like the spinner to hide when I click on the "Hide" button. I am getting the following error :</p>
  
  <pre><code>Uncaught ReferenceError: showButton is not defined
      at HTMLButtonElement.onclick (VM282:180)
  onclick @ VM282:180
  VM282:179  
  
  Uncaught ReferenceError: hideButton is not defined
      at HTMLButtonElement.onclick (VM282:179)
  onclick @ VM282:179.
  </code></pre>
  
  <p>Can someone please suggest a solution? </p>
  
  <p>Thanks</p>
  
  <p>Sachin</p>