JSFiddle - React, Tailwind, and code Playground

HTML

<div id=forOutput></div>
<div id=eachOutput></div>
<div id=mapOutput></div>

CSS

body {
    font-family: Verdana;
    font-size: 10pt;
}

JavaScript

var people = [
    { name: 'Joe', city: 'Amherst', state: 'MA' },
    { name: 'Sarah', city: 'Portlandia', state: 'OR' },
    { name: 'Jim', city: 'San Diego', state: 'CA' }
];

var names;

names = [];
for(var i = 0; i < people.length; i++) {
    names.push(people[i].name);
}

$('#forOutput').text(names.join());


names = [];
$.each(people, function() {
    names.push(this.name);
});

$('#eachOutput').text(names.join());


names = $.map(people, function(person) {
    return person.name;
});

$('#mapOutput').text(names.join());