title: Why does my JQuery script seems to only works before beginning to browse my tabs if the content of my tabs is the same everywhere?
body: <p>Why does the JQuery script I use in all my pages seems to only works before beginning to browse my tabs if the content of my tabs is the same everywhere ?</p>
  
  <p>I have a tab view web page built with JQuery and AJAX.</p>
  
  <p>This is my JQuery functions:</p>
  
  <pre><code>$(document).ready(function(){
      $(".box .more").click(function(event){
          alert('test'); 
      });
  
      $("a.linkTab").click(function(event){
          var tabID = $('.linkTab')[0].toString().split('#')[1];
          $.ajax({
              url : "loadPage.php?tabID=" + tabID,
              success : function (data) {
                  $('#body').html(data);
              }
          });
      });
  });
  </code></pre>
  
  <p>This is my body web page:</p>
  
  <pre><code>&lt;div id="header"&gt;...&lt;/div&gt;
  &lt;div id="body"&gt;
      &lt;div class="box"&gt;
          &lt;p class="more"&gt;LinkLike&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="footer"&gt;&lt;a href="#9"&gt;9&lt;/a&gt;&lt;/div&gt;
  </code></pre>
  
  <p>loadPage.php only include needed page that Ajax script sent.</p>
  
  <p>My tab system works perfectly, I can navigate in the page I want. Before navigating, When I click on the LinkLike, the alert appears. But, when I browse tabs, When I click, there is nothing.</p>
  
  <p>Why does the JQuery script seems to only works before beginning to browse.</p>
  
  <p>Important, the file I imports from php contains exactly the same body than the first one. The file contains:</p>
  
  <pre><code>&lt;div class="box"&gt;
      &lt;p class="more"&gt;LinkLike&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>