JSFiddle - React, Tailwind, and code Playground

by gedave

HTML

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap-tooltip.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap-modal.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap-popover.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/lang/en-gb.js"></script>
<!-- jquery 1.10.2, bootstrap 2.3.2, angular 1.2.1, momentjs 2.5.1 -->
<div id="output">xxxxx</div>

JavaScript

getData();

var val = data[0].name;
console.log(val);
$("#output").html(val);

function getData() {
    var data = [{
        "Name": "32-CHANNEL: NOT 32-CHANNEL COVERAGE-CA - 1005",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "ADVANTAGE WINDOWS: NO ADVANCE WORKSTATION-CA - 1006",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "FE Coverage HOURS/DAYS: M-F 0800-2100-CA - 1008",
            "Type": "Non-Usage Based",
            "Service_Hours": "M-F 0800-2100-CA",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "FE Coverage Weekdays: M-F 0800-2100-CA - 1009",
            "Type": "Non-Usage Based",
            "Service_Hours": "M-F 0800-2100-CA",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "FE Coverage Weekend: NO COVERAGE HRS-CA - 1010",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "FE Onsite Response Time: 02-CA - 1011",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "GE SUPPLIED COILS: GE SUPPLIED COILS-CA - 1012",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start": "9/1/2012",
            "End": "8/31/2017",
            "Status": "Active"
    }, {
        "Name": "Hardware Upgrades: NONE-CA - 1013",
            "Type": "Non-Usage Based",
            "Service_Hours": "",
            "Start":...