jquery拼接数据循环一个数据列表
但从后端请求过来json数据之后，需要把数据做成循环列表，那么，怎么jquery拼接数据循环一个数据列表？现在写一个简单的demo，效果如下所示：
参考代码如下：
<!DOCTYPE html>
<meta charset="UTF-8">
<title>告警列表</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<style>
.rightcont {
height: 80px;
margin-top: 12px;
background: #f1f1f1;
border-radius: 8px;
padding-top: 15px;
.iconalarm {
float: left;
width: 20%;
text-align: center;
.detailalarm {
float: left;
width: 65%;
.namealarm {
float: left;
width: 15%;
</style>
</head>
<div id="active">
<ul class="rightalarm">
<!--右侧报警监控 -->
<div class="rightcont">
<div class="iconalarm">
<img src="images/fence/fence2.png" />
<p>sos</p>
<div class="detailalarm">
<p>2019-7-3 10:08</p>
<p>王大治发出SOS报警</p>
<div class="namealarm">
</body>
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var cont = [{
"image1": "images/fence/fence1.png",
"alarmtype": "sos",
"date": "2019-7-3 10:08",
"details": "李一男进入二道门危险区域",
"alarmname": "员工"
"image1": "images/fence/fence2.png",
"alarmtype": "危险",
"date": "2019-7-3 10:07",
"details": "孙二娘滞留生产车间8小时",
"alarmname": "访客"
"image1": "images/fence/fence3.png",
"alarmtype": "滞留",
"date": "2019-7-3 10:00",
"details": "马云脱岗窜岗报警",
"alarmname": "员工"
"image1": "images/fence/fence2.png",
"alarmtype": "脱岗",
"date": "2019-7-3 9:36",
"details": "王小婷走进办公室区域",
"alarmname": "访客"
var html = "";
$.each(cont, function(k, v) { //这里的函数参数是键值对的形式，k代表键名，v代表值
html += '<div class="rightcont">';
html += '<div class="iconalarm">';
html += '<img src=' + cont[k].image1 + ' />';
html += '<p>' + cont[k].alarmtype + '</p> </div>';
html += '<div class="detailalarm">';
html += ' <p>' + cont[k].date + '</p>';
html += ' <p>' + cont[k].details + '</p></div>';
html += ' <div class="namealarm">' + cont[k].alarmname + ' </div></div>';