Javascript 在ajax响应上不起作用

砖石结构在我的ajax响应中不起作用。我尝试过一些类似的方法，但对我不起作用。 我的代码是：

<script>
function loadmore(cnt)
    {
        var val = document.getElementById("result_no").value;
        $.ajax({
            type: 'get',
            url: '{{ URL::route('oi_array3') }}',
            data: {
            last:val,cnt
            },
            success: function (response) {
                var content = document.getElementById("uf");
                if (response == '') {
                    $("#load").hide();
                }

              `  response.forEach(function(value){
                    var d = new Date(value.timestamp);
                    var n = d.toDateString();
                    var s = d.toLocaleTimeString();

                    content.innerHTML += '<div class="grid-item oi_data_tile">' + 
                    '<div class="small-12 text-right timestamp columns">' + n + ' ' + s + '</div>' + 
                    '<label class="small-6 columns">Underlying Index</label>' + 
                    '<label class="small-6 text-right nifty_index columns">' +
                    '<strong>' + value.underlying_index + '</strong>' +
                    '</label>' +
                    '<label class="small-6 columns">Diff. in change in OI</label>' +
                    '<label class="small-6 text-right nifty_index columns">' +
                    '<strong>' + value.diff_in_change_in_oi + '</strong></label>' +

                    '<div class="small-12 columns">'+
                        '<table class="small-12 columns">'+
                            '<tr class="header">' +
                                '<td class="small-3">Chng in OI Call</td>' +
                                '<td class="small-3">Strike<br>price</td>' +
                                '<td class="small-3">Chng in OI Put</td>' +
                                '<td class="small-3">Diff in Chng in OI</td>' +
                            '</tr>'+    

                            '<tr>' +
                                '<td class="text-right">' + value.derivatives[0].change_in_oi_call + '</td>' +
                                '<td class="text-right">' + value.derivatives[0].strike_price + '</td>' +
                                '<td class="text-right">' + value.derivatives[0].change_in_oi_put + '</td>' +
                                '<td class="text-right bullish">' + value.derivatives[0].diff_in_change_in_oi + '</td>' +

                            '</tr>' +

                            '<tr>' +
                                '<td class="text-right">' + value.derivatives[1].change_in_oi_call + '</td>' +
                                '<td class="text-right">' + value.derivatives[1].strike_price + '</td>' +
                                '<td class="text-right">' + value.derivatives[1].change_in_oi_put + '</td>' +
                                '<td class="text-right bullish">' + value.derivatives[1].diff_in_change_in_oi + '</td>' +

                            '</tr>' +

                            '<tr>' +
                                '<td class="text-right">' + value.derivatives[2].change_in_oi_call + '</td>' +
                                '<td class="text-right">' + value.derivatives[2].strike_price + '</td>' +
                                '<td class="text-right">' + value.derivatives[2].change_in_oi_put + '</td>' +
                                '<td class="text-right bearish">' + value.derivatives[2].diff_in_change_in_oi + '</td>' +

                            '</tr>' +

                        '</table>' +
                    '</div>'+
                    '</div>' 
                    if(document.getElementById("result_no").value == '0')
                        document.getElementById("latestvalue").value = value.timestamp;

                    document.getElementById("result_no").value = value.timestamp;



                });   
            }//response close
        });//ajax close
    }//loadmore close

    $('.grid').masonry({
        columnWidth : 320, 
        gutter: 15,
        percentPosition: false, 
        fitWidth: true,
        isFitWidth: true,
        itemSelector: '.grid-item'
    });

    $('.grid').imagesLoaded(function() {
        $('.grid').masonry('layout');
    }); 

</script>

函数加载更多（cnt）
{
var val=document.getElementById（“结果号”）.value；
$.ajax({
键入：“get”，
url:{{url:：route（'oi_array3'）}}，
数据：{
最后：瓦尔，cnt
},
成功：功能（响应）{
var content=document.getElementById（“uf”）；
如果（响应=“”）{
$（“#加载”）.hide（）；
}
`response.forEach（函数（值）{
var d=新日期（值.时间戳）；
var n=d.toDateString（）；
var s=d.toLocaleTimeString（）；
content.innerHTML+=''+
'+n+'+s+'+
“基础指数”+
'' +
“”+value.undernative_index+””+
'' +
“OI变化差异”+
'' +
“”+value.diff\u in\u change\u in\u oi+””+
''+
''+
'' +
“Chng in OI Call”+
“罢工价格”+
"陈仁爱Put"+
“变化中的差异”+
''+    
'' +
''+值.导数[0].在调用中更改''+
''+价值.衍生品[0].履约价格+''+
''+值。导数[0]。更改输入值中的值''+
''+值.导数[0].差异变化''+
'' +
'' +
''+值.导数[1].调用中的更改''+
''价值+衍生品[1].履约价格+''+
''价值+衍生工具[1].在出售中更改''+
''+值.导数[1].变化中的差异''+
'' +
'' +
''+值.导数[2].调用中的更改''+
''价值+衍生品[2].履约价格+''+
''价值+衍生工具[2].在出售中更改''+
''+值.导数[2].变化中的差异''+
'' +
'' +
''+
'' 
if（document.getElementById（“结果号”）.value==“0”）
document.getElementById（“latestvalue”）.value=value.timestamp；
document.getElementById（“结果号”）.value=value.timestamp；
});   
}//响应关闭
})；//关闭
}//再近一点
$（'.grid'）。砌体({
列宽：320，
排水沟：15，
位置：false，
菲特：是的，
是的，
itemSelector:“.grid项”
});
$（'.grid'）.imagesLoaded（函数（）{
$（'.grid'）。砌体（“布局”）；
}); 

Html代码是：

<div class="small-12 columns" id="uf1">
    <div class="grid" id="uf">
    <!-- ajax response is added here.-->

    </div>
    <input type="hidden" id="result_no" value="0">
</div>

---

我想将ajax响应放在id中，并在响应中应用砖石结构。

将内容添加到DOM后，需要重新初始化砖石结构。这是砌体将能够针对新添加的元素的方式

$('.grid').masonry();

每次加载新内容后调用此函数。

$（'.grid'）。应在DOM操作后执行砌筑操作。

。。。