Button does not stay clicked and photos do not show

$(document).ready(function() {

// user clicks button

  $("button").click(function() {
    $("button").removeClass("selected");
    $(this).addClass("selected");

    // JS obtains word on the button
    var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
    var animal = $(this).text();
    var flickerOptions = {
      tags: animal,
      format: "json"
    };

    // add a link and <img> to the page, receive JSON response
    var displayPhotos = function(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>';
      }); // end loop

      photoHTML += '</ul>';
      $('#photos').html(photoHTML);
    } // end function displayPhotos

    // make a GET request to Flickr, sending the word

    $.getJSON(flickerAPI, flickerOptions, displayPhotos);

  }); // end button click

}); // end ready