jQuery AJAX load() Method

The load() method loads HTML or text content from a server and puts the returned data into the selected element. This method is the simplest way to fetch data from the server.

Syntax

 
[selector].load( url, [data], [callback] )

URL: URL which need to load.
data: Represents a map of data that is sent with the request.
callback: Name of a function to be executed after the load().

 
$("button").click(function(){
    $("#contentDiv").load("external.txt");
});

 
<div id="contentDiv">Waiting for load()....</div>

Try it Yourself

Waiting for load()....

Full Source

 
<html>
<head>
<title>jQuery load()</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("#contentDiv").load("external.txt");
    });
});
</script>
</head>
<body>
  <div id="contentDiv">Waiting for load()....</div>
  <button>Load Content</button>
</body>
</html>

Next : Difference between document.ready() and body onload()?