Navigator,
<!DOCTYPE html>
<html>
<head><meta charset="utf-8">
<style>
body{
background-color: #FFD700;
}
table {
border-spacing: 20px 20px;
}
td, th {
color: white;
padding: 17px;
font-weight: 600;
background-color: green;
}
.shadow {
box-shadow: 0 0 10px rgba(0,0,0,0.5);
padding: 10px;
}
.magenta {
background-color: magenta;
}
</style>
</head>
<body>
<script>
var text = '{"employees":[' +
'{"Title":"Иванов", "Highlight": true },' +
'{"Title":"Петров", "Highlight": false },' +
'{"Title":"Иванов", "Highlight": false },' +
'{"Title":"Петров", "Highlight": false }]}',
obj = JSON.parse(text);
</script>
<table id = "mytab">
</table>
<script type="text/javascript">
var Petr = 'Петров';
var Ivan = 'Иванов';
var newrow = document.getElementById('mytab').insertRow();
for(i=0; i<obj.employees.length; i++) {
var newcell = newrow.insertCell(i);
if (obj.employees[i].Title == Petr) newcell.classList.add("magenta");
if (obj.employees[i].Highlight) newcell.classList.add("shadow");
newcell.innerHTML = obj.employees[i].Title;
}
</script>
</body>
</html>