"CSS Layout Techniques" was retired on February 22, 2017. You are now viewing the recommended replacement.

Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript AJAX Basics (retiring) jQuery and AJAX Use jQuery's .load() method

Posted by Samantha Fluke
Samantha Fluke
7,163 Points

In the app.js file, use jQuery to select the footer div of the web page. Look at the index.html file to see how the HTML

I can't figure out why this won't pass? I'm doing it the same as the example in the video and the same as suggested answers in the forums here and it still won't work.

app.js 
function sendAJAX(){
  $('#footer').load
}
index.html 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>AJAX with JavaScript</title>
</head>
<body>
  <div id="main">
    <h1>AJAX with jQuery</h1>
  </div>
  <div id="footer"></div>
  <script src="jquery.js"></script>
  <script src="app.js"></script>
</body>
</html>

2 Answers

deebird
deebird
7,558 Points
deebird
deebird
7,558 Points

They aren't asking for a function, but use jquery load

$('#footer').load('footer.html');
Samantha Fluke
Samantha Fluke
7,163 Points

The quiz says it's still wrong when I add 'footer.html' inside the ().

John Lack-Wilson
John Lack-Wilson
8,181 Points
John Lack-Wilson
John Lack-Wilson
8,181 Points

Hi Samantha, thanks for your question.

  • The challenge is not asking for you to create a function, it simply wants you to target #footer.

If we wanted to target an element with ID container we could do it like this:

$('#container');
  • .load() requires a string parameter.

If we wanted to load a HTML document, into #container, called header.html, we could do it like this:

$('#container').load('header.html');

I hope that helps.

Samantha Fluke
Samantha Fluke
7,163 Points

I understand how this works, but the quiz still won't accept my answer, even when I add "footer.html' inside the load ().

function sendAJAX(){ $('#footer').load('footer.html'); }

John Lack-Wilson
John Lack-Wilson
8,181 Points
John Lack-Wilson
John Lack-Wilson
8,181 Points

It's because you have the function sendAJAX() part.

It should just be:

$('#footer').load('footer.html');
Samantha Fluke
Samantha Fluke
7,163 Points

Ah! Ok, it was a bit differently laid out than the example given. Thanks!