title: When I am changing the innerHtml, bootstrap tab event is not working anymore
body: <p>This is my HTML code:</p>
  <pre><code>&lt;ul class=&quot;nav nav-tabs&quot;&gt;
      &lt;li class=&quot;active&quot;&gt;&lt;a href=&quot;#menu1&quot; data-toggle=&quot;tab&quot;&gt;menu1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href=&quot;#menu2&quot; data-toggle=&quot;tab&quot;&gt;menu2&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>This is my javascript code which changing the innerHTML:</p>
  <pre><code>document.body.innerHTML = document.body.innerHTML.replace( text1, text2 );
  </code></pre>
  <p>and this my jquery code for handling events:</p>
  <pre><code>$('a[data-toggle=&quot;tab&quot;]').on( 'shown.bs.tab', function (e) { 
      alert('test');
  }); 
  </code></pre>
  <p>when the java code to change innerHTML is running, the event of tab is not working anymore</p>