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

Carole Nissen
Carole Nissen
5,655 Points
Posted by Carole Nissen
Carole Nissen
5,655 Points

Unexpected error (Uncaught ReferenceError: $ is not defined)

I'm following along on the Ajax Basics/Ajax and APIs/Adding Jquery video and just can't make my code work - I can't see any discrepancies at all, but I keep getting the above error message, along with the subtitle "(anonymous function)" on line 1 of this js file....

$(document).ready (function () {
  $("button").click (function () {

  $(this).addClass ("selected");

  });//end click function

});//end ready

Any help gratefully received before I scream!

5 Answers

Carole Nissen
Carole Nissen
5,655 Points
Carole Nissen
Carole Nissen
5,655 Points

Yayyyy! I solved it....but I don't have the faintest idea how it worked! I copied the html from the 'finished' html file and pasted it into the project html file and then suddenly everything worked....!!! I toggled the page loads of times to try & check through to see where there was an error in the html but I couldn't find anything out of place. Maybe I missed a dot or something but at least it's now working and that's something that anyone else having this problem could try too...!

Cody Te Awa
Cody Te Awa
8,820 Points
Cody Te Awa
Cody Te Awa
8,820 Points

Hi Carole, I have read through and tested your code and there appears to be nothing whatsoever wrong with it. However the error you mention only appears when you have not successfully imported the jquery library. I haven't done a Treehouse web tutorial for a while but however you are importing the use of jquery you may want to check. (: (Common ways are having a copy of the jquery file included into your local directory, or outsourcing it through something like Google's API, either way you need to have a <script> tag in your html that includes jquery).

Carole Nissen
Carole Nissen
5,655 Points
Carole Nissen
Carole Nissen
5,655 Points

Thank you for taking the time to reply Cody - and absolutely - I'd actually found a suggestion regarding that on stackoverflow so I changed the jquery link from the treehouse url to the google CDN link - it didn't help!!! I've had problems a couple of times the last few days where the code looks right but it doesn't work on workspaces and it's just so frustrating cos I think I'm missing something, so it's really good to know someone else can't see any errors either. I think I'll ask treehouse if there's a problem with workspaces at the mo...thanks again! Carole

Joel Bardsley
Joel Bardsley
31,246 Points
Joel Bardsley
Joel Bardsley
31,246 Points

You would normally get this error if you load your own js file before jquery gets loaded. Can you confirm that you haven't placed the <script src="js/flickr.js"></script> line above your jquery <script> tag in your index.html?

Carole Nissen
Carole Nissen
5,655 Points
Carole Nissen
Carole Nissen
5,655 Points

Thank you Joel too - but yes, I haven't placed the flickr.js file above the jquery <script> tag - in fact I haven't touched the html that treehouse provided for this project (that's why I didn't post it here)....I'm going to tell treehouse tech about it as soon as I get a minute (life keeps getting in the way...)