title: Backbone view DOM element removed
body: <p>I keep reading about the Backbone.js zombie (or memory leak) problem. Basically you have to unbind and remove the element from the DOM when you no longer need it to make sure all events are removed as well.</p>
  
  <p>Now, I have a single page app with a few containers:</p>
  
  <pre><code>&lt;div id="page1"&gt;&lt;/div&gt;
  &lt;div id="page2"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and add my underscore.js templates to these placeholders. I have a model per page like:</p>
  
  <pre><code>HomeView = Backbone.View.extend({
    el: '#page1'
  )}
  </code></pre>
  
  <p>Now, when I click on an element on that page I navigate to another Backbone.js view:</p>
  
  <pre><code>clicked: function(ev){
    $(this.el).remove(); // &lt;-- this is the problem
    $(this.el).unbind();
    App.navigate('page/2', true);
  }
  </code></pre>
  
  <p>This works fine but... I removed the <code>page1</code> element from the DOM so when I use the back button to go to the previous page my element is gone and there is nothing to attach the HTML to.</p>
  
  <p>I probably don't understand how to link Backbone.js views with the DOM... should I keep the element with the risk of memory leaks?</p>
  
  <p>Thanks!</p>