Unload backbone view and unregister events

I'm trying to create a simple editor where you can click on an element and load a script template with a simple input and when I type I wish to update to DOM element. The problem is, if I click on the heading, then the intro and start typing the text is updated for both the heading and the intro. How can I "unload" the view and only let one view live?

$(function() {
  window.Brick = Backbone.View.extend({
    initialize: function() {},
    render: function() {
      this.$el.mouseenter(function() {
        $(this)
          .css('outline', 'solid #467ace 1px')
          .css('outline-offset', '-1px')
          .css('cursor', 'pointer');
      }).mouseleave(function() {
        $(this)
          .css('outline', 'none')
          .css('cursor', 'default');
      });
    },
    events: {
      "click": "openEditor"
    },
    openEditor: function(event) {

      event.preventDefault();

      console.log('load editor');

      var self = this;

      self.editorView = new MyView({
        el: $('#editor-panel'),
        editorName: self.$el.attr('data-brick-name'),
        editor: self.$el
      });
    }
  });

  window.MyView = Backbone.View.extend({
    editorName: null,
    editor: null,
    initialize: function(options) {
      _.extend(this, _.pick(options, "editorName"));
      _.extend(this, _.pick(options, "editor"));
      this.render();
    },
    render: function() {
      var self = this;
      // Compile the template using underscore
      var template = _.template($('#' + self.editorName).html());
      // Load the compiled HTML into the Backbone "el"
      this.$el.html(template);
    },
    events: {
      'keyup :input': 'logKey'
    },
    logKey: function(e) {
      console.log($(this.editor).text());
      $(this.editor).text($(e.currentTarget).val());
    }
  });
});

$(function() {
  $('[data-editable="true"]').each(function(e) {
    console.log(e);
    var self = $(this);
    var brick = new Brick({
      el: self
    }).render();
  });
});

<script src="http://ift.tt/1oMJErh"></script>
<script src="http://ift.tt/1yCEpBg"></script>
<script src="http://ift.tt/1Ctitri"></script>



<h1 data-editable="true" data-brick-name="heading">Lorem ipsum</h1>
<p data-editable="true" data-brick-name="intro">Lorem ipsum dolar sit amet...</p>

<div id="editor-panel">
</div>

<script type="text/template" id="heading">
  <label for="Heading">Rubrik</label>
  <input name="Heading" type="text" value="Lorem ipsum" />
</script>

<script type="text/template" id="intro">
  <label for="Intro">Intro</label>
  <textarea name="Intro">Lorem ipsum dolar sit amet...</textarea>
</script>