JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
</head>
<body>
    <style>
    #myAppsSectionGridTable .ui-li-heading { 
        /*font-size: 16px;*/
        margin: .3em 0; 
    }
    #myAppsSectionGridTable .ui-li-desc { 
        /*font-size: 12px;*/
        margin: -.5em 0 .3em; 
    }
    
    #myAppsSectionGridTable .ui-li .ui-btn-inner au.ui-link-inherit, #myAppsSectionGridTable .ui-li-static.ui-li {
        padding-top: .1em; 
        padding-bottom: .1em;
    }    
    </style>
    <div data-role="page" id="page">
        <div data-role="header">
             <h3>Header</h3>
        </div>
        <div data-role="content">
            <p>Condensed Style</p>
            <div id="accMain0" data-role="collapsible" data-inset="true" data-collapsed="false">
                <h3>Travel</h3>
                <ul id="myAppsSectionGridTable" data-role="listview" data-inset="false">
                    <li><a><img src="Images/travel.png" alt="" class="ui-li-icon" />
                        <h3>Victor Chavez</h3>
                        <p>Try Again NAck12345</p>
                    </a></li>
                    <li><a><img src="Images/travel.png" alt="" class="ui-li-icon" />
                        <h3>Victor Chavez</h3>
                        <p>Try Again NAck12345</p>
                    </a></li>
                <ul>
            </div>
            <p>Normal Style</p>
            <div id="accMain0" data-role="collapsible" data-inset="true" data-collapsed="false">
                <h3>Travel</h3>
                <ul id="myAppsSectionGridTable1" data-role="listview" data-inset="false">
                    <li><a><img...