JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://eurica.github.io/pdjs/js/pdjs.js"></script>
<div id="output">Loading...</div>

CSS

a { text-decoration: none; }
.schedule { font-weight: bold; }

JavaScript

// As always configure PDJS with your subdomain and api-key
PDJS = new PDJSobj({
    subdomain: "webdemo",
    token: "CkNpsqH9i6yTGus8VDzA",
})

// Here's the minimum possible UI:
printf = function (str) {
    console.log(str)
    $("#output").append(str)
}

//In case we have more than 100 escalation policies, I'll use PDJS's api_all helper function:
PDJS.api_all({
    res: "escalation_policies",
    final_success: function (json) {
        //Once we've loaded all the EP's, clear the "loading..." message:
        $("#output").html("")
        console.log(json)
        
        //use jQuery to iterate over eac EP
        $.each(json.escalation_policies, function (i, ep) {
            printf("<h1>" + ep.name + "</h1>")
            //Within each EP, loop over the escalation rules:
            $.each(ep.escalation_rules, function (i, er) {
                printf("<h2>Level "+(i+1)+"</h2>")
                // Each escalation rule can have up to 10 targets (users or schedules):
                $.each(er.targets, function (i, t) {
                    if (t.type == 'user') printf("<p><a class='user' href='http://" + PDJS.subdomain + ".pagerduty.com/users/" + t.id + "'>" + t.name + "</a>")
                    if (t.type == 'schedule') {
                        printf("<p><a class='schedule' href='http://" + PDJS.subdomain + ".pagerduty.com/schedules/" + t.id + "'>" + t.name + "</a>: <span class='" + t.id + "'>loading users...</span>")
                        // If it's a schedule, user schedule/users to find who's on that schedule
                        PDJS.api({
                            res: "schedules/" + t.id + "/users",
                            success: function (json) {
                                console.log(json)
                                var users = ""
                                $.each(json.users, function (i, u) {
                                    users += "<a class='user' href='http://" + PDJS.subdomain + ".pagerduty.com/users/" + u.id...