title: Managing jQuery click events with backbone views
body: <p>What's the best way of creating jQuery click events for a backbone view that is rendered multiple times?  It seems like I should be using $().on() in my view's initializer, but this doesn't work unless I call it after it is rendered.</p>
  
  <p>Basically, I'm rendering a table, and checking for click events on the rows.  Here's what I'm trying (in coffeescript).  This does not work - </p>
  
  <pre><code>class MyGridView extends Backbone.View
    el: '#myGrid'
    template: _.template(TableTmpl)
  
    initialize: -&gt; 
      # $('tr',@el).on 'click', -&gt; console.log($(@).attr('model')) # WRONG
      $(@el).on 'click', 'tr', -&gt; console.log($(@).attr('model')) # CORRECT
  
    render: -&gt;
      $(@el).empty()
      $(@el).append(@template({data: @collection.getPage()}))
  </code></pre>
  
  <p>This works, but does this create orphaned click events?</p>
  
  <pre><code>class MyGridView extends Backbone.View
    el: '#myGrid'
    template: _.template(TableTmpl)
  
    render: -&gt;
      $(@el).empty()
      $(@el).append(@template({data: @collection.getPage()}))
      $('tr',@el).click -&gt; console.log($(@).attr('model'))
  </code></pre>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>I was missing a parameter to $().on(), which is why it didn't work.  I also tried events, which seems like a better way of handling this, which worked like:</p>
  
  <pre><code>class MyGridView extends Backbone.View
    el: '#myGrid'
    template: _.template(TableTmpl)
    events: {'click tr', 'selectModel'}
  
    selectModel: -&gt;
      model = $(e.target).parent().attr('model')
      console.log(model)
  
    render: -&gt;
      $(@el).empty()
      $(@el).append(@template({data: @collection.getPage()}))
      $('tr',@el).click -&gt; console.log($(@).attr('model'))
  </code></pre>