JSFiddle - React, Tailwind, and code Playground

by jfriend00

HTML

<div id="result"></div>

CSS

#result {font-family: "Courier New";}
.number {color: #F00;}

JavaScript

var list = [
  {"menuName":"Contact Info","sectionName":"contacts"},
  {"menuName":"Facilities","sectionName":"facilities"},
  {"menuName":"Locations","sectionName":"locations"},
  {"menuName":"Packages","sectionName":"packages"},
  {"menuName":"Policies","sectionName":"policies"},
  {"menuName":"Reviews","sectionName":"reviews"},
  {"menuName":"Rooms","sectionName":"rooms"}
];
    
var cnt1 = 0;
for (var i = 0; i < list.length; i++) {
    ++cnt1;
}

var cnt2 = 0;
for (var i in list) {
    ++cnt2;
}

var result = "";
result += "for (var i = 0; i < list.length; i++) had <span class='number'>" + cnt1 + "</span> iterations<br><br>"; 

result += "for (var i in list) had <span class='number'>" + cnt2 + "</span> iterations";

$("#result").html(result);