title: AJAX load in same page causes divs to repeat
body: <p>I'm performing the ajax call to the same page which works perfectly however it reload existing divs. I was wondering if there was a way to suppress it? Here's more details:</p>
  
  <h2>My project setup</h2>
  
  <p><strong>index.php - Open records Controller</strong></p>
  
  <pre><code>/**app logic**/
  
  view('open',$data); //require '../views/layout.php';
  </code></pre>
  
  <p><strong>layout.php</strong></p>
  
  <pre><code>/*all the js scripts and stylesheets loaded here*/
  
  &lt;div id='logo'&gt;&lt;/div&gt;
  &lt;div id='nav'&gt;&lt;/div&gt;
  
  include($path); //loads the open.view.php file
  </code></pre>
  
  <p><strong>open.view.php</strong></p>
  
  <pre><code>/*AJAX call to self*/
  
  
  function getViaAjax(chosenGroup){
      $.post('index.php',{group:chosenGroup},
                  function(data)
                  {   
                      $("#default").remove();
                      $('#group-tickets').html(data);
                  });
  }
  </code></pre>
  
  <p>As you might be able to tell, this causes the <code>#logo</code> and <code>#nav</code> div to duplicate on the page. I understand that I can do a AJAX post to a different file and I will get around the issue altogether but I was wondering if there's a way to do this?</p>