JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<div data-role="page" id="page1">

	<div data-role="header" data-position="fixed">
		<h1>Page 1</h1>
	</div>

	<div role="main" class="ui-content">
		<a href="#page2">To page 2</a>
	</div>

	<div data-role="footer"  data-position="fixed">
		<h4>Page Footer</h4>
	</div>
</div>

<div data-role="page" id="page2">

	<div data-role="header" data-position="fixed">
		<h1>Page 2</h1>
	</div>

	<div role="main" class="ui-content">
		<a href="#page3">To page 3</a>
	</div>

	<div data-role="footer"  data-position="fixed">
		<h4>Page Footer</h4>
	</div>
</div>

<div data-role="page" id="page3">

	<div data-role="header" data-position="fixed">
		<h1>Page 3</h1>
	</div>

	<div role="main" class="ui-content">
		<a href="#page4">To page 4</a>
	</div>

	<div data-role="footer"  data-position="fixed">
		<h4>Page Footer</h4>
	</div>
</div>

<div data-role="page" id="page4">

	<div data-role="header" data-position="fixed">
		<h1>Page 4</h1>
	</div>

	<div role="main" class="ui-content">
		<a href="#page5">To page 5</a>
	</div>

	<div data-role="footer"  data-position="fixed">
		<h4>Page Footer</h4>
	</div>
</div>

<div data-role="page" id="page5">

	<div data-role="header" data-position="fixed">
		<h1>Page 5</h1>
	</div>

	<div role="main" class="ui-content">
		
	</div>

	<div data-role="footer"  data-position="fixed">
		<h4>Page Footer</h4>
	</div>
</div>

JavaScript

if ($.cookie('lastpage')) {
$( ":mobile-pagecontainer" ).pagecontainer( "change", "#"+$.cookie('lastpage'))    
}

$(document).on("pageshow", function (e, data) {
 var pageid = $.mobile.pageContainer.pagecontainer( 'getActivePage' ).attr( 'id' );
  $.cookie('lastpage', pageid)  
});