How to reference a Wordpress page in an Ajax function

How to reference a Wordpress page in an Ajax function

I am using a jQuery Ajax function on a Wordpress page.

There are 5 "tabs" on the page, which call five separate pages of content to fill a div container on the page.

I do NOT want to use jQuery tabs. The Ajax works great.

The only problem is that I can't figure out how to reference a page in Wordpress,

I have tried:

   -  using the "shortcut" code for the page (" http://www.maxwellparknc.org/?p=450")

   - using the page name with the ID appended {"nat-crime-patrol-overview?page_id=450")

   - using the page name .php with the ID appended {"nat-crime-patrol-overview/php?page_id=450")

   - just using the "slug"  {"nat-crime-patrol-overview")


The only thing that works is using the absolute URL for a unique HTML page located in the root.

Fine, it works, but I want to keep all my content pages in the WP Pages section.

Any ideas??????  Thank you in advance!!

Here is the jQuery code, and following that is the HTML from the parent page.



      jQuery(document).ready(function() {
          jQuery(".tabs li a").click(function() {
      
              $("#nat-content").empty().append("<div id='loading'><img src='images/loading.gif' alt='Loading' /></div>");
              $(".tabs li a").removeClass('active');
              $(this).addClass('active');
      
              $.ajax({ url: this.href, success: function(html) {
                  $("#nat-content").empty().append(html);
                  }
          });
          return false;
          });
      
          $("#nat-content").empty().append("<div id='loading'><img src='images/loading.gif' alt='Loading' /></div>");
          $.ajax({ url: ' http://www.maxwellparknc.org/wp-content/themes/mpnc-theme/test-ajax.html', success: function(html) {
                  $("#nat-content").empty().append(html);
                  $(".tabs li:first-of-type a").addClass('active');
          }
          });
      });





 <ul id="crime-tabs" class="tabs">
    <li class="active"><a href=" http://www.maxwellparknc.org/wp-content/themes/mpnc-theme/test-ajax.html">overview<br />&amp; actions</a></li>
    <li><a href=" http://www.maxwellparknc.org/wp-content/themes/mpnc-theme/test-ajax-2.html">Security<br />Patrol</a></li>
    <li><a href=" http://www.maxwellparknc.org/wp-content/themes/mpnc-theme/test-ajax-3.html">Crime Prevention<br />&amp; Report a crime</a></li>
    <li><a href="#tab4">Video Security<br />Tips &amp; Tricks</a></li>
    <li><a href="#tab5" class="last">Resources<br />&amp; Links</a></li>
  </ul>



<div id="nat-content">




</div>  <!-- end nat content div -->