backbone.js - Backbone events disappear with bootstrap tab -

i've found strange beaviour backbone views events , bootstrap tabs.

in application, views attached bootstrap tabs.

when click on tab, view attached tab must (re)-rendered or inserted in tab (to reflect updates on model occurred in other views).

however, i've realized events attached views deleted somehow after tab clicked.

i've created js fiddle demonstrating : http://jsfiddle.net/ybm4j/

any ideas ?

js:

window.app = {         views: {}     };      app.views.sessionlist = backbone.view.extend({         tagname: 'select',          events: {             'change': 'selectionchanged'         },          initialize: function () {             _.bindall(this, 'selectionchanged');             this.render();         },          render: function () {             $(this.el).append('<option value="option1">option 1</option>');             $(this.el).append('<option value="option2">option 2</option>');             return this;         },          selectionchanged: function (e) {             var value = $(e.currenttarget).val();             $("#result").html(value + ' selected');         }     });      $(document).ready(function () {          var view = new app.views.sessionlist();         var view2 = new app.views.sessionlist();         $(".body-container #tab1").html(view.el);         $(".body-container #tab2").html(view2.el);          $('.tab').click(function () {             $(".body-container #tab1").html(view.el);             $(".body-container #tab2").html(view2.el);         });     }); 

html:

<div class='body-container'>     <!-- nav tabs -->     <ul class="nav nav-tabs">         <li class="active tab"><a href="#tab1" data-toggle="tab">tab1</a>         </li>         <li class="tab"><a href="#tab2" data-toggle="tab">tab2</a>         </li>     </ul>      <!-- tab panes -->     <div class="tab-content">         <div class="tab-pane active" id="tab1"></div>         <div class="tab-pane" id="tab2"></div>     </div> </div>  <div id='result'></div> 

for rerendering tabs, don't update complete html. in case, view objects available coz of closures, can call render() method. here updated fiddle.

http://jsfiddle.net/4fmpp/

$('.tab').click(function(){                  view.render();             view2.render();         });