title: "Uncaught TypeError: object is not a function" when calling a function
body: <p>I am having this odd error with my code. I am trying to troubleshoot a page that [used] to work in Chrome but not in IE (suprise suprise) by adding specific triggers but now I am getting the <code>Uncaught TypeError: object is not a function</code> error in Chrome's console.</p>
  
  <p>As far as I can tell this is a function (work in progress):</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      function validate() {                
              var id = jQuery("form").attr('id');
              var formid = "#"+id;
              jQuery(formid).add("&lt;input type=\"hidden\" name=\"APC_UPLOAD_PROGRESS\" value=\""+id+"\" /&gt;");
              jQuery("#validate").hide();
              jQuery("#submitme").show();
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>It is being called by the following code:</p>
  
  <pre><code>&lt;button id="validate" onClick="validate()" type="button"&gt;Validate&lt;/button&gt;
  </code></pre>
  
  <p>I am not using <code>&lt;input type="submit&gt;</code> as I have extra form submit JS to run.</p>
  
  <p>So when I click the button the page does nothing and I get titular said error in the console.</p>
  
  <p>I have tried using <code>jQuery.fn.validate = function(){};</code> but to no avail.</p>
  
  <p>To make this more interesting, the site is Wordpress and this particular page loads jQuery and MooTools as well as have straight JS.</p>
  
  <p>In a nutshell; what silly little mistake have I made? All the searches on google are years old and generated by what I assume to be classes.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>The console says this line is the error</p>
  
  <pre><code>&lt;button id="validate" onClick="validate()" type="button"&gt;Validate&lt;/button&gt;
  </code></pre>
  
  <p><strong>UPDATE 2</strong></p>
  
  <p>Pastbin link to the form code <a href="http://pastebin.com/3Kw5vdhn" rel="nofollow">http://pastebin.com/3Kw5vdhn</a></p>