无法使我的骨干脚本工作

Question

我对javascript很新，对骨干来说是全新的。我做错了什么？为什么这不起作用？什么都不会显示，错误消息是Uncaught TypeError：无法在下划线脚本中读取null的属性'replace'。

(function($) {

  var Session = Backbone.Model.extend({
    defaults: {
      title: ''
    }
  });

  var session1 = new Session({title: '1'});
  var session2 = new Session({title: '2'});
  var session3 = new Session({title: '3'});
  var session4 = new Session({title: '4'});

  var SessionList = Backbone.Collection.extend({
    url: '#',
    model: Session,
    localStorage: new Store("session-list-store")
  });

  var sessions = new SessionList();

  var SessionView = Backbone.View.extend({
    model: Session,
    tagName: 'li',
    template: _.template($('#item-template').html()),
    initialize: function () {
      this.render()
    },

    render: function () {
      var template = _.template($('#item-template').html(), {})
      console.log(template);
      this.$el.html(this.template(this.model.title));
      return this;
    }
  });

  var SessionListView = Backbone.View.extend({
    model: sessions,
    el: '#main',
    initialize: function () {
      this.template = _.template($('#session-list').html());
      sessions.fetch(); // Loads list from local storage
    },

    render: function () {
      this.$el.html('title');
      return this;
    }
  });

  sessionView = new SessionView();
  sessionListView = new SessionListView();

 })(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>
<div class="col-sm-8 sessions">
  <h2>Sessions</h2>
  <section id="main">
    <ul class="session-list"></ul>
  </section>
</div>

<script type="text/template" id="item-template">
    <div class="view"></div>
</script>