JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css">
<script src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
<h1>Click For Full Gallery</h2>
<div class="thumbholder">
     <h2>
        Photo Set 1
      </h2>

    <div id="72157634235266773" class="thumb"></div>
</div>
<div class="thumbholder">
     <h2>
        Photo Set 2
      </h2>

    <div id="72157633471728555" class="thumb"></div>
</div>

CSS

.show {
    padding: 5px;
}
.hide {
    display: none
}

JavaScript

$('.thumb').each(function () {

    $(document).ready(function () {
        var PhotoSetID = $(".thumb").attr("id");

        var url = "http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=f0b84fba1c00631410b85b90720f52ba";
        var src;
        $.getJSON(url + "&photoset_id=" + PhotoSetID + "&format=json&jsoncallback=?", function (data) {
            $.each(data.photoset.photo, function (i, item) {
                src = "http://farm" + item.farm + ".static.flickr.com/" + item.server + "/" + item.id + "_" + item.secret + ".jpg";
                title = item.title;


                $("<a>").attr({
                    "href": src,
                        "class": "gallery",
                        "title": title
                }).html(
                $("<img />").attr({
                    "src": src,
                        "alt": title,
                        "class": (i === 0 ? "show" : "hide"),
                        "width": "240",
                        "height": "180"
                })

                ).appendTo("#" + PhotoSetID);


            });

        });

    });
});

$(window).load(function () {
    $(".gallery").colorbox({
        rel: 'group1'
    });
});