title: Loading dynamic external content into the Div of another on click
body: <p>Trying to load an external php file into another onClick. Iframes will not work as the size of the content changes with collapsible panels. That leaves AJAX. I was given a piece of code</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;a href="#" id="getData"&gt;Get data&lt;/a&gt;
  &lt;div id="myContainer"&gt;&lt;/div&gt;
  JS
  
  $('#getData').click(function(){
      $.get('data.php', { section: 'mySection' }, function(data){
         $('#myContainer').html(data);
      });
  });
  PHP:
  
  &lt;?php
      if($_GET['section'] === 'mySection') echo '&lt;span style="font-weigth:bold;"&gt;Hello World&lt;/span&gt;';
  ?&gt;
  </code></pre>
  
  <p>I have tested it here <a href="http://www.divethegap.com/scuba-diving-programmes-dive-the-gap/programme-pages/dahab-divemaster/divemaster-trainingA.php" rel="nofollow noreferrer">http://www.divethegap.com/scuba-diving-programmes-dive-the-gap/programme-pages/dahab-divemaster/divemaster-trainingA.php</a> and get the most unexpected results. It certainly loads the right amount of items as it says in the lower bar on safari but I see three small calendars and that is it. Can anyone see where I have made a mistake?</p>