Change the text of a span element using an AJAX request:

JQuery is a great tool which provides a rich set of AJAX methods to develope next generation web application.
AJAX is a short hand for asynchronous JavaScript and XML.
All jQuery AJAX methods use the ajax() method. This method is mostly used for requests where the other methods cannot be used.

At its simplest, the $.ajax() function can be called with no arguments.
The jQuery.ajax( options ) method loads a remote page using an HTTP request.
$.ajax() returns the XMLHttpRequest that it creates.

The first thing we are going to do is create a button click event. Once a user clicks a button it will call a function that handles the AJAX and Change the text of a span element using an AJAX request.

First we have index.html. That is our main file. Our AJAX calls are made from that file to sample.txt. Here is index.html:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $.ajax({url:"sample.txt",success:function(result){
      $("span").html(result);
    }});
  });
});
</script>



text