JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="instagram">
</ul>

CSS

ul.instagram {
  list-style: none;
}

ul.instagram li {
  float: left;
}

ul.instagram li img {
  height: 100px;
}

JavaScript

$(document).ready(function(){

	var username = "hadidapp";
	var max_num_items = 5;

	var jqxhr = $.ajax( "https://www.instagram.com/"+username+"/?__a=1&" ).done(function() {
		//alert( "success" );
	}).fail(function() {
		//alert( "error" );
	}).always(function(data) {
		//alert( "complete" )
   	items = data.graphql.user.edge_owner_to_timeline_media.edges;
		$.each(items, function(n, item) {
			if( (n+1) <= max_num_items )
			{
				var data_li = "<li><a target='_blank' href='https://www.instagram.com/p/"+item.node.shortcode+"'><img src='" + item.node.thumbnail_src + "'/></a></li>";
				$("ul.instagram").append(data_li);
			}
		});

  	});

});