jQuery/AJAX - Load content into a div when button clicked?

Question

Would someone be able to help here?

I would like to fill a div e.g.

with content from an e

Answer 1

Use jQuery.click and jQuery.load:

$(document).ready(function(){
    $('.classloader.').click(function(){
        $('#contenthere').load('/includes/about-info.html');
    });
})

Answer 2

Try the following:

var myurl = 'myfileonthesamedomain.html';

$('button').click(function(){
    $('div.loadme').load(myurl);
});

Answer 3

Use this simple and sobher it also do run time binding as well:

$(document).ready(function(){
    $(document).on('click','.classloader',(function(){
        $('#contenthere').load('/includes/about-info.html');
    });
})

Answer 4

Load latest version of jQuery:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

jQuery code:

<script language="javascript">
$(function(){
  $(".classloader").click(function(){
    $("#contenthere").load("/includes/about-info.html");
  });
});
</script>

HTML code:

<p class="classloader">Click Here</p>
<div id="contenthere"></div>

Answer 5

You could subscribe to the .click() event of the paragraph and then use the .load() function to send an AJAX request to the given url and inject the results into the specified selector:

$(function() {
    $('.classloader').click(function() {
        $('#contenthere').load('/includes/about-info.html');
        return false;
    });
});