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 jQuery Basics (2014) Creating a Simple Lightbox Perform: Part 1

Posted by sammarxz
.a{fill-rule:evenodd;}techdegree
sammarxz
Front End Web Development Techdegree Student 7,815 Points

Uncaught TypeError: $ is not a function

My Code:

(function(){

//ImageGallery
    $('#imageGallery a').click(function(e){
        e.preventDefault();
        var href = $(this).attr('href');
        console.log(href);
    });

})();

CONSOLE ERROR:

Uncaught TypeError: $ is not a function

Chyno Deluxe
Chyno Deluxe
16,936 Points

//Fixed Code Presentation

1 Answer

Jonathan Johnson
seal-mask
.a{fill-rule:evenodd;}techdegree
Jonathan Johnson
Full Stack JavaScript Techdegree Student 952 Points
Jonathan Johnson
.a{fill-rule:evenodd;}techdegree
Jonathan Johnson
Full Stack JavaScript Techdegree Student 952 Points

This typically means that jQuery has not been loaded.

I would confirm that the following line is still in your index.html file near the bottom before the app.js file is included (where I assume this code is currently).

<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
sammarxz
.a{fill-rule:evenodd;}techdegree
sammarxz
Front End Web Development Techdegree Student 7,815 Points

thanks for your answer, but it is already certain and continues in error.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="assets/js/app.js"></script>

before </body>

"use strict";

(function(){

//Menu
    $('.menu-toggle').click(function(e){
        e.preventDefault();
        var body = $('body');

        body.toggleClass('menu-open');
        (this.classList.contains("is-active") === true) ? this.classList.remove("is-active") : this.classList.add("is-active");
    });


 //ImageGallery
    $('#imageGallery a').click(function(e){
        e.preventDefault();

        var imageLocation = $(this).attr("href");
        console.log(href);
    });

})();