Need basic help using JQuery and AJax. I have an ul
<div id="topics">
<h1><a href="index.html">JQuery</a></h1>
<h3>A Working Primer</h3>
<ul>
<li><a href="articles/includingJQuery.html">Including JQuery</a></li>
<li><a href="articles/tools.html">Tools of the Trade</a></li>
</ul>
</div>
An empty div where I like the Ajax content to be loaded into on the same page as above:
<div id="articles">
</div>
and my script
$(document).ready(function(){
$("#topics ul li a").click(function(){
$('#articles').load('');
return false;
});
});
Not exactly sure what to put in the load so its dynamic. Any help is appreciated :)
If the content is located at the href
attribute location, then you need to get that attribute's value:
$('#articles').load(this.href);
so try this:
$(document).ready(function(){
$("#topics ul li a").click(function() {
// use the content of the href attribute
// for the load parameter
$('#articles').load(this.href);
return false;
});
});