jsonファイルからコンテンツを該当のブロックに出し分けるjs

<div class="container js-block">
</div>

.container{
    max-width:960px;
    margin:0 auto;
}

.container section ul li{
    float: left;
    margin-right: 1.8%;
    margin-bottom:1.8%;
    width: calc((100% - 1.8% * 3) / 4);
    list-style:none;
}

.container section ul li:nth-child(4n){
    margin-right:0;
}

.container section ul:after{
   clear:both;
   content:"";
   display:table;
}

$.ajax({
    type: 'GET',
    url: '/images/blog/2017/07/data_170712.json',
    dataType: 'jsonp',
    jsonpCallback: 'blockJSON'
})
.then(

    /*読み込み成功時*/
    function blockJSON(json) {
        for(var i in json){
            var $num = i;
            $('.js-block').append('<section class="js-'+$num+'"><h2 class="hdg-l2-01">' + json[i].heading + '</h2><ul>');
            for(var j in json[i].person){
                $('section.js-'+$num).find('ul').append('<li><img src=" + json[i].person[j].img + "></li>');
            }
        }
    },
    
    /*読み込み失敗時*/
    function () {
        alert("読み込み失敗しました");
});

デモの解説記事に戻る