title: How to pass Event as a parameter in JQuery function
body: <p>Hi I am learning JQuery and I have written a small function where I am attaching a function with a button's click event.</p>
  
  <p>this is the head element of the HTML</p>
  
  
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
      $(pageLoaded); 
  
      function pageLoaded() 
      {
          $("#Button1").bind("click", 
                              { key1: "value1", key2: "value2" }, 
                              function buttonClick(event) 
                              {
                                 $("#displayArea").text(event.data.key1);
                              }
                              );
      }                    
  
  &lt;/script&gt;
  </code></pre>
  
  <p>This is the body of the HTML</p>
  
  <pre><code>&lt;input id="Button1" type="button" value="button" /&gt;
  
  &lt;div id = "displayArea" style="border:2px solid black; width:300px; height:200px"&gt;
  </code></pre>
  
  <p>This code works fine. But when I try to write the buttonClick function outside the anonymus method, it does not work anymore.</p>
  
  <p>I tried to call it this way: </p>
  
  <pre><code>$("#Button1").bind("click", 
                     { key1: "value1", key2: "value2" }, 
                     buttonClick(event));
  
  function buttonClick(var event) 
  {
        $("#displayArea").text(event.data.key1);
  }
  </code></pre>
  
  <p>This is not working. Am I doing some mistake while passing the Event as parameter? what is the correct way to do it without using anonymous methods?</p>