JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/1.5.1/jquery.mockjax.js"></script>
<div class="first">
    <a class="btn" href="#">click me</a>
</div>
<div class="second">
    <div class="body"></div>    
</div>

JavaScript

var script_url = "/pets";

$(document).ready(function(){
    $('.first a.btn').click(function(){
        $('.first a.active').removeClass('active');
        $(this).addClass('active');
        $('.second .title').addClass('active');
    
        var id = $(this).data('cat-id');
    
        var wrap = $('<div>');
    
        $.ajax({
            url:    script_url,
            type:   "post",
            data: {"cat": id},
            dataType: "json"
        }).success(function(result){
            if(result.status == "ok"){
                $.each(result.data, function(i, elem){
                    var item = $("<div class='body-area'>").append($("<img src='" + elem.image + "'>"));
                    link = $("<a href='#results' class='btn'>");
                    link.text(elem.name);
                    link.data('subcat-id', elem.id);
                    item.append(link);
    
                    wrap.append(item);
    
                });
                $('.second .body').html(wrap).slideDown('fast');
            }
        });
    });
    
    $('.second a.btn').live('click', function(){
        $('.second .body-area.active').removeClass('active');
        $(this).parent().addClass('active');
    
        var sub_id = $(this).data('subcat-id');        
    
        $.ajax({
            url:    script_url,
            type:   "post",
            data: {"subcat": sub_id},
            dataType: "json"
        }).success(function(result){
            if(result.status == "ok"){
                $('.third .title').text(result.data.title);
                $('.third .body').html(result.data.body);
                $('.third').slideDown('fast'); 
            }
        });        
    });
});

$.mockjax({
    url:  '/pets',
    responseText: { status: "ok", data: [ { id: 0, name: "Fluffy" }, { id: 1, name: "Rex" } ] }
});