JSFiddle - React, Tailwind, and code Playground

HTML

<div id='page_nav'>
    <!-- Navigation Elements -->
</div>

JavaScript

var pages = {

    "home": {
        "resource_name": "Home",
            "name": "Home Page",
            "header": "Featured"
    },

        "catalogue": {
        "resource_name": "Browse",
            "name": "Browse Catalogue",
            "header": "Public Catalogue"
    }

};


$(document).ready(function () {
    for (var key in pages) {
        if (pages.hasOwnProperty(key)) {
            //Add a new link for the Menu Navigation Element
            document.getElementById('page_nav').innerHTML += "<a id='nav_" + key + "'>" 
            + pages[key].name + "</a><br /><br />";

            //Create a new callback for the Menu Navigation Element
            $('#nav_' + key).click(createCallBack(key));
        }
    }

});

//Function for returning a callback
function createCallBack(key) {
    return function () {
        alert("Callback fired");
    }
}