Jquery，如何动态地将数据绑定到div属性？

Question

我试图弄清楚如何从Json动态组织和追加html。 Json数据的键是Image，id，link，ajaxlink。我的HTML看起来像这样：

            <div class="col s12 m6 l3">
                <div class="card z-depth-4">
                    <div class="card-image waves-effect waves-block waves-light" style="height:350px">
                        <a href="@Url.Action("Movie", "Home", new { id ="", title = "", year="" })">
                            <img class="activat" src="">
                        </a>
                    </div>
                    <div class="card-content blue-grey darken-4">
                        <span class="card-title activator grey-text text-darken-1"><a class="a-title truncate" style="color:inherit">title</a><i class="material-icons right" onclick="loadDoc('id', 'ajax')">more_vert</i></span>
                        <p><a href="#">Report broken link</a></p>
                    </div>
                    <div class="card-reveal blue-grey darken-4">
                        <span class="card-title grey-text text-darken-1 title-wrap"><i class="material-icons right">close</i></span>
                        <div id=""></div>
                    </div>
                </div>
            </div>

我的jquery令人尴尬

$(".tab a").click(function (e) {
    var url = "";
    var fillentry = $('#fillentry');
    var test = $(e.target).text();
    if (test === 'Top Viewed Today') {
        var url = "http://topview-today"; 
    } else if (test === 'Most Favorite') {
        var url = "https://top-favorite";
    } else if (test === 'Top Rating') {
        var url = 'https://top-rating';
    } else if(test === 'Top show'){
        url = 'https://top-show';
    }
    else {
        throw new Error('kill execution');
    }

    $.ajax({
        url: '../../Home/tabcontent?=' + url,
        type: "GET",
        
        success: function (response) {
            $.each($.parseJSON(response), function (i, item) {
                fillentry.empty();
                if (item.length) {
                    var fill1 = '<div class="card z- depth - 4" id="fill1">'+ '<div class="card-image waves-effect waves-block waves-light" style="height:350px">'+
                        '< a href= "@Url.Action("Movie", "Home", new { id ="", title = "", year="" })">' +
                        '<img class="activat" src="' + item.image + '">' +
                        '</a>'+
                    '</div >'
                        + '<div class="card-content blue-grey darken-4">' +
                        '<span class="card-title activator grey-text text-darken-1">' + '<a class="a-title truncate" style="color:inherit">title</a>' + '<i class="material-icons right" onclick="loadDoc(' + item.id + ',' + item.ajax+ ')">more_vert</i>'+'</span>'
                            +'<p>'+'<a href="#">Report broken link</a>'+'</p>'
                        +'</div>'+
                        '<div class="card-reveal blue-grey darken-4">'
                            +'<span class="card-title grey-text text-darken-1 title-wrap"><i class="material-icons right">close</i>'+'</span>'+
                            '<div id="">'+'</div>'+
                        '</div>' + '</div>';
                    fillentry.append(fill1);
                }
               
            });

我需要通过Json对象进行交互并将数据绑定到网格。