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) AJAX and APIs Displaying the Photos

Justin Dake
Justin Dake
5,659 Points

Unexpected Token < in Flickr HTML

When I preview my page the console gives me the following error.

Uncaught SyntaxError: Unexpected token <

When I explore using the console navigator I find that the error points to the DOCTYPE declaration within the data that Flickr's page returns. Why is this happening?

$(document).ready(function() {
  $('button').click(function() {
    $("button").removeClass("selected");
    $(this).addClass("selected");
    var flickrAPI = "http://api.fickr.com/services/feeds/photos_public.gne?jsoncallback=?";
    var animal = $(this).text(); // gets text in an HTML element
    var flickrOptions = {
      tags: animal,
      format: "json"
    };
    function displayPhotos(data) {
      var photoHTML = '<ul>';
      $.each(data.items, function(i, photo) {
        photoHTML += '<li class="grid-25 tablet-grid-50">';
        photoHTML += '<a href="' + photo.link + '" class="image">';
        photoHTML += '<img src="' + photo.media.m + '"></a></li>';
      });
      photoHTML += '</ul>';
      $('#photos').html(photoHTML);
    }
    $.getJSON(flickrAPI, flickrOptions, displayPhotos);
  });
 });

1 Answer

Chris Shaw
Chris Shaw
26,676 Points

Hi Justin,

You have a minor typo in the Flickr URL which is you're missing the letter L, simply add that in so it reflects the below and your code should work fine after that.

https://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?

Happy coding!