JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html> 
<html> 
    <head> 
        <title>My Page</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
    </head> 
    <body>
        <div data-role="page">
            
            <div data-role="header">
                <h1>My Title</h1>
            </div><!-- /header -->
        
            <div data-role="content">
                <h1>Something that can handle a table like this</h1>
                <br>
                <table border="1" cellspacing="0" cellpadding="0">
    
                    <tr>
      
                        <td width="73" valign="top"><p>&nbsp;</p></td>
        
                        <td width="162" valign="top"><p align="center">China &amp; Hong Kong<br />
        
                                <em>Mandarin</em></p></td>
          
                    </tr>
      
                    <tr>
      
                        <td width="73" valign="top"><p>Hello</p></td>
        
                        <td width="162" valign="top"><p align="center">n&#464;h&#462;o</p></td>
        
                    </tr>
      
                    <tr>
      
                        <td width="73" valign="top"><p>Goodbye</p></td>
        
                        <td width="162" valign="top"><p align="center">z&agrave;iji&agrave;n</p></td>
        
                    </tr>
      
                    <tr>
      
                        <td width="73" valign="top"><p>Please</p></td>
        
                        <td width="162" valign="top"><p align="center">qing</p></td>
        
                    </tr>
      
                    <tr>
      
                        <td width="73" valign="top"><p>Thank...