将Json响应转换为html并应用css

Question

我正在使用

从数据库中以json格式回复

json_encode(result);

回复就像

[{"restaurant_id":"c3d6","cityname":"Test","resname":"Tomatoes","locname":"Sector 
test","locaddress":"test","locpincode":"123456","locfoodtype":"Indian, 
Chinese","locminorder":"200",}]

现在，我想在HTML中显示这些值，如同在页面上的预定义div中一样 而我正在尝试这样

function makeProdiv(data){
      var tbl_body = "";
        $.each(data, function() {
          var tbl_row = "",
              currRecord = this;
            tbl_row += "<div class=restaurant-header gradient-gray clearfix>";
          $.each(this, function(k , v) {
            if(k==="resname"){
                tbl_row += "<div class=restaurant-title>
               <h2 style=font-size:12px>
               <a href=restodetail?res_id=&location= title=>"+v+"</a></h2>
               <span class=restaurant-title-address style=font-size:10px></span>
               </div></div>";
            }

          })
          tbl_body += tbl_row;
        })

    return tbl_body;
  }

通过ajax

调用上述函数

  $.ajax({
      type: "POST",
      url: "page",
      dataType : 'json',
      cache: false,
      data: {filterOpts: opts},
      success: function(records){
      var result = records.toString();
        if(result==''){
            $('#restodetail').html("<br/><span style=color:red;font-size:16px>Oops!! No Records to show</span>");
        }else{
            $('#restodetail').html(makeProdiv(records));
        }
      }
    });

请告诉我如何附加到HTML并在json元素上应用css类