JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="menu">
        <ul>
        </ul>
    </div>
    <div class="page">
    </div>
</div>

CSS

.container {
    position: relative;
    width: 100%;
}

.menu {
    float: left;
    width: 25%;
}

.menu a {
    text-decoration: none;
}

.page {
    float: left;
    width: 75%;
}

JavaScript

var $pageCollection;

function buildMenu($xmlDoc) {
    var $menu = $('div.menu > ul'),
        $pageDetail = $('div.page'),
        items = [];
    
    // Get page collection
    $pageCollection = $xmlDoc.find('Categories');
    
    $pageCollection.each(function (index, element) {
        var $page = $(element),
            item = $('<li><a href="javascript:void(0)" data-index="' + index + '">' 
                     + $page.find('CategoryName').html() + '</a></li>');
        
        items.push(item);
    });
    
    // Show page 0 for default
    var $firstPage = $pageCollection.first(),
        $contentPage = $firstPage.find('Description').html();
    
    $pageDetail.html($contentPage);
    
    // Add event handlers
    $menu.append(items);
    $menu.on('click', 'a', onAnchorClick);
}

function getXml(url, callback) {
    $.post(url, {
        xml: '<CategoriesRoot><Categories><CategoryID>1</CategoryID><CategoryName>Beverages</CategoryName><Description>Soft drinks, coffees, teas, beer, and ale</Description></Categories><Categories><CategoryID>2</CategoryID><CategoryName>Beverages 2</CategoryName><Description>Soft drinks 2, coffees 2, teas 2, beer 2, and ale 2</Description></Categories></CategoriesRoot>'
    }, function (response) {
        var $xmlDoc = $(response);
        
        callback($xmlDoc);
    });
}

function onAnchorClick(event) {
    var $pageDetail = $('div.page'),
        $anchor = $(event.currentTarget),
        index = $anchor.attr('data-index');
    
    // Clear previous content
    $pageDetail.empty();
    
    // Show current page
    var $currentPage = $pageCollection.eq(index),
        $contentPage = $currentPage.find('Description').html();
    
    console.dir($contentPage);
    
    $pageDetail.html($contentPage);
}

$(function () {
    var url = '/echo/xml/';
    
    getXml(url, buildMenu);
});