title: Open a link without a page reload
body: <p>When I click on the link i want <strong>page2.html</strong> to appear without any reloading of the current page. Despite all trials, when i click on the link it does reload the entire page before displaying page2.html</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script&gt;
    $(document).ready(function() {
      $("a").click(function(event) {
        var $this = $(this),
          url = $this.data("url");
  
        $(document.body).load(url);
        event.preventDefault();
      });
    }); &lt; /script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>homepage.html</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a href="#" data-url="page2.html" class="topic-list-item"&gt;
  
    &lt;h3 class="topic-title"&gt;Internet Protocol Basics&lt;/h3&gt;
  
    &lt;div class="topic-description-text"&gt;
      Learn how Internet Protocol is used
    &lt;/div&gt;
  &lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>