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

Posted by Omar KADIRI HASSANI
Omar KADIRI HASSANI
4,959 Points

$('#footer').html() does not seem to be interpreted correctly by the verification procedure

Hi,

I got stuck at the verification part in the task 3 of this challenge: https://teamtreehouse.com/library/add-a-callback

I believe the code I wrote should be correct (especially when looking at the Bummer indication).

$.get("footer.html", function (response) { const $footer = $('#footer'); $footer.html(response); })

I also tried with $('#footer').html(response), but it still does not work.

Even the preview is working as it should.

Can you please help me understand where the problem is?

3 Answers

Adam Beer
Adam Beer
11,314 Points

Oh yes, I found it. Task.2 // So now don't save the selected footer inside the const. Task.3 // Write the selected item in a row with .html() method. Hope this help.

Adam Beer
Adam Beer
11,314 Points
Adam Beer
Adam Beer
11,314 Points

Footer an html element or an id name? If id name use inside the $('#//id selector'), but if it the html element use simple $(footer).

Omar KADIRI HASSANI
Omar KADIRI HASSANI
4,959 Points

Hi Adam,

Thank you for answer. footer is an ID: 

<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>

The problem does not seem to come from selecting the element:

In the task 2 of the challenge, I was asked to select it, and this code worked: 

const $footer = $("#footer");

The problem is with task 3, where I am asked to change its content with the .html jQuery method. So I wrote this code: 

$.get("footer.html", function (response) {
    const $footer = $("#footer");
  $footer.html(response);
//I also tried with $('#footer').html(response) and with $('#//footer') which did not seem to pass the verification process of the task 2
});

Which seems to work just fine in the preview, but does not pass the verification process.

Is there something missing in my code or would it be possible that this might be some bug ?

Thanks again for your time,

Omar KADIRI HASSANI
Omar KADIRI HASSANI
4,959 Points
Omar KADIRI HASSANI
Omar KADIRI HASSANI
4,959 Points

That was exactly it! I found it yesterday too, late at night, so I could not find the time to post it here.

Thanks again!

Hope this will help anyone who stumbles upon it in the future.