title: JQuery - Best way of wiring GUI objects to events?
body: <p>Ever since JQuery came along a few years ago I've been using it in all my client-side scripts. Initially I used the '$() syntax to grab and manipulate objects this, to me, is the 'old skool' paradigm of explicitly wiring up button events to functions:</p>
  
  <pre><code>&lt;button onClick='myFunction(this);' ...  /&gt;
  </code></pre>
  
  <p>with a related function:</p>
  
  <pre><code>function myFunction(obj){
      alert('this is how old-timers like me do it!')
  }
  </code></pre>
  
  <p>Some of my colleagues prefer to do the attaching of scripts to events a la JQuery:</p>
  
  <pre><code>$(document).ready(
      $("#myButton").click(
          function(event){
              alert('this is the newer JQuery way of doing things');
          }
      );
  );
  </code></pre>
  
  <p>Initially I found the overly-bracey JQuery syntax with its reliance on anonymous functions etc. difficult to read, but my eyes and brain have adjusted so I'm happy with either way now. I would however like our codeshop to be consistent. Does anyone have any opinions on which approach is 'better'? </p>