JSFiddle - React, Tailwind, and code Playground

by Johnny Garces

HTML

<div id="employeeList">

</div>

JavaScript

var employeeStatus = [
  {
   "name": "Aimee",
   "inoffice": false
  },
  {
   "name": "Amit",
   "inoffice": false
  },
  {
   "name": "Andrew",
   "inoffice": true
  },
  {
   "name": "Ben",
   "inoffice": true
  },
  {
   "name": "Elizabeth",
   "inoffice": true
  },
  {
   "name": "Guil",
   "inoffice": false
  },
  {
   "name": "Hampton",
   "inoffice": true
  },
  {
   "name": "Jason",
   "inoffice": true
  },
  {
   "name": "Lainie",
   "inoffice": true
  },
  {
   "name": "Kenneth",
   "inoffice": false
  }, 
  {
   "name": "Pasan",
   "inoffice": true
  },
  {
   "name": "Shawna",
   "inoffice": true
  },
  {
   "name": "Zac",
   "inoffice": false
  }
];


var employeeContainer = document.getElementById('employeeList');
var employeeListWrapper = document.createElement('ul');

for(var i=0; i<employeeStatus.length; i++){
	var employeeListName = document.createElement('li');
  employeeListName.appendChild(document.createTextNode(employeeStatus[i].name));
  employeeListWrapper.appendChild(employeeListName);
  employeeContainer.appendChild(employeeListWrapper);
}