Simple ajax call to dynamically load page content, solving issues of page caching etc.

HTML

  $AjaxUrlHtml = "var ajaxurl = '" . admin_url('admin-ajax.php') . "';";

  <script>
  $AjaxUrlHtml
  jQuery(document).ready(function(){

    var post_data = {
               'action': 'my_ajax_action_callback',   //The name of the ajax callback action in functions.php
               'my_value_1': 'AjaxTest'
    };

    jQuery.post(ajaxurl, post_data, function(response) {
      //----- CALLBACK SUCCESS - RESPONSE RECEVIED -----
      document.getElementById( 'ajax_output1' ).innerHTML = response;
    });

  });
  </script>
  <div id='ajax_output1'></div>

AJAX Callback

//***********************************
//***********************************
//********** AJAX CALLBACK **********
//***********************************
//***********************************
add_action ( 'wp_ajax_my_ajax_action_callback', 'my_ajax_action_callback' );        //For AJAX calls made for logged in users
add_action ( 'wp_ajax_nopriv_my_ajax_action_callback', 'my_ajax_action_callback' ); //For AJAX calls made from non logged in users
function my_ajax_action_callback()
{
  $my_value_1 = '';
  if (isset($_POST['my_value_1']))
    $my_value_1 = $_POST['my_value_1'];
  
  $ReturnHtml = "HELLO: " . $my_value_1;
  
  echo ($ReturnHtml);
  
  wp_die();     //Terminate immediately and return a proper response
}