<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.marketing{
float:left;
width: 100px;
margin: 10px;
padding: 30px;
border: 4px solid black;
background: #9932CC;
text-align:center;
box-shadow: 0 0 20px rgba(0,0,0,2);
}
.sales{
float:left;
width: 100px;
margin: 10px;
padding: 30px;
border: 4px solid black;
background: #1E90FF;
text-align:center;
}
</style>
</head>
<body>
</body>
<script>
var s = '[{"title" : "marketing"},{"title" : "sales"},{"title" : "marketing"},{"title" : "sales"}]';
var obj = JSON.parse(s);
for(var i = 0; i < obj.length;i++){
var div = document.createElement('div');
div.className = obj[i].title;
div.innerText = obj[i].title;
document.querySelector('body').appendChild(div);
}
</script>
</html>