JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css">
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<div data-role="page" id="page01">
    <div data-role="header">
        <h1>Page 01</h1>
    </div><!-- /header -->
    <div data-role="content" id="replacement-target">    
        <p><a href="#page02">Link to page 02</a>.</p>
        <p><a id="testcode">Replace content from page02</a></p>
    </div><!-- /content -->
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->
            
<div data-role="page" id="page02">
    <div data-role="header" >
        <h1>Page 02</h1>
    </div>
    <div data-role="content" id="source-content">
        <p>page 2 content</p>
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
    
</div>

JavaScript

$("#testcode").click( function () {
    
   $('#replacement-target').html( $('#source-content').html() ); 
});