javascript - Why this render function doesn't work? -

i have been playing backbone , trying learn it. i'm stuck @ point while. not able figure out what's wrong following code?

  render: function() {     this.$el.empty();     // render each subview, appending our root element     _.each(this._views, function(sub_view) {       this.$el.append(sub_view.render().el); // error on line    }); 

you have got context issue. this refering doesn't contain $el looking for. can fix declaring self variable points appropriate this. following code should work you.

render: function() {     var self = this; //added line declare variable (self) point 'this'      this.$el.empty();     _.each(this._views, function(sub_view) {       self.$el.append(sub_view.render().el); //used 'self' here instead 'this'  }); 

side note: leaning backbone should know commong javascript problem document reflow. render view every single model in collection. can lead performance issues , on old computers , mobile devices. can optimise code rendering in container , appending once, rather updating dom each time. here example:

render: function() {   this.$el.empty();   var container = document.createdocumentfragment();   _.each(this._views, function(sub_view) {     container.appendchild(sub_view.render().el)   });   this.$el.append(container); }