title: Backbone: Binding to the view's wrapping div
body: <p>I have a backbone IndexView which calls a TaskView for each 'task' model. I'd like to bind an event to the li element that <em>wraps</em> the taskview. So for example, the 'className' attribute is 'task', and I want to trigger an event on '.task'.</p>
  
  <p>I can bind from the parent (IndexView) view, but I'd like access to information inside the clicked view, which I'm guessing means the event should be bound to the child TaskView(?)</p>
  
  <p>(Also, DOM classes <em>inside</em> the actual tasks template can be accessed...just not the wrapping .task li)</p>
  
  <p>Any ideas appreciated - code below.</p>
  
  <h2>CHILD VIEW</h2>
  
  <p>Backbonescaffolddemo.Views.Tasks ||= {}</p>
  
  <pre><code>class Backbonescaffolddemo.Views.Tasks.TaskView extends Backbone.View
    template: JST["backbone/templates/tasks/task"]
  
    tagName: "li"
    className: "task"
  
    events:
      "click .task"    : "demoMethod"
  
    initialize: () -&gt;
      _.bindAll(this, 'demoMethod', 'render')
      console.log @
      #@showTask()
      @el.id = 'sort_order_' + @model.get('id') if @model
  
    destroy: () -&gt;
      @model.destroy()
      this.remove()
      return false
  
    demoMethod: () -&gt;
      console.log 'Work dammit, work. Arghhh'
  
    render: -&gt;
      $(@el).html(@template(@model.toJSON() ))    
      return this
  </code></pre>
  
  <h2>PARENT VIEW</h2>
  
  <pre><code>Backbonescaffolddemo.Views.Tasks ||= {}
  
  class Backbonescaffolddemo.Views.Tasks.IndexView extends Backbone.View
    template: JST["backbone/templates/tasks/index"]
    id: "taskList"
  
    events: 
      "keyup #searchTasks" : "searchTasks"
  
    initialize: () -&gt;
      _.bindAll(this, 'addOne', 'sortable', 'task_id_from_element', 'addAll', 'searchTasks', 'updateSort', 'sortable', 'render')
      @options.tasks.bind('reset', @addAll)
      @options.tasks.bind('reset', @sortable)
      @options.tasks.bind('add', @render)
      @updateSort()
      @sortable()
  
    #...
  
    addAll: () -&gt;
      @options.tasks.each(@addOne)
  
    addOne: (task) -&gt;
      view = new Backbonescaffolddemo.Views.Tasks.TaskView({model: task})
      $(@el).append(view.render().el)
  
    render: -&gt;
      $(@el).html(@template(tasks: @options.tasks.toJSON() ))
      @addAll() 
      return this
  </code></pre>