Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript AJAX Basics (retiring) AJAX and APIs Adding jQuery

Doesnt work code in flickr.js

I am writing piece of code to use button actions, but it is not work

$(document).ready(function () { $('button').click(function () { $('button').removeClass("selected"); $(this).addClass("selected"); }); // end button.click }); // end ready

and this is what I have into index.html

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>AJAX Flickr Photo Feeder</title> <link href='http://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" ></script>> <script src="js/flickr.js"></script> </head> <body> <div class="grid-container centered"> <div class="grid-100"> <div class="contained"> <div class="grid-100"> <div class="heading"> <h1>Flickr Photo Feeder</h1> <p>Choose which kind of animal you'd like to return photos of...</p> </div> <ul class="filter-select"> <li><button>Dog</button></li> <li><button>Cat</button></li> <li><button>Moose</button></li> </ul> </div>

    <div id="photos">

    </div>
  </div>
</div>

</div> </body> </html>

2 Answers

Gabriel, If I am understanding your question correctly you are unable to change the background color of the button once clicked with the jquery code. Here are a couple things to try.

1) Have you made sure there is a class "selected" in the css file that changes the background color? (.selected {background-color: darkgrey;} I added this and it worked for me.

2) Not sure if you have added the script file to your index file which may be an issue if the file is not being loaded. You can check this by checking the developer console and see if it is not finding your .js file.

Hope this helps, Mindy

aamir asif
aamir asif
6,125 Points

Mindy, How to check if the console is not loading over JS file? Aamir

Hey there, change the src attribute in your <script> from sr="js/flickr.js" to src="../js/flikr.js". That's going to grab the file from the parent directory of the js file.