title: jquery unbind click
body: <p>I'm going nuts just trying to unbind an onclick handler from the event in jQuery so I can bind it later on to another function. </p>
  
  <p>I have isolated the code in a test page so there's nothing but the meat, just a button that calls a function and a script that <strong>tries</strong> to unbind it:</p>
  
  <pre><code>&lt;%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %&gt;
  
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
                        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head id="Head1" runat="server"&gt;
      &lt;script src="../../Scripts/jquery-1.3.2.min.js" type="text/javascript"&gt;
      &lt;/script&gt;
  
      &lt;script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"&gt;
      &lt;/script&gt;
  
      &lt;script type="text/javascript" language="javascript"&gt;
          $(document).ready(function() { $("#btnNext").unbind('click'); });
          function hi() {window.alert("hi");}
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
      &lt;input id="btnNext" type="button" value="Next" onclick="hi();" /&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Anybody knows why the click event keeps calling the hi() function no matter what I said in the document.ready?</p>
  
  <p>Thanks</p>