JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" value="add a new section">
<div data-role="page" id="pageHome" data-theme="a">
    <div data-role="content">
        <center>
             <h3><a href="#pageHome" data-role="none"><img src="images/logo.png" /></a></h3>

        </center>
        <div class="dydivarr0"></div>
        <br />
        <div data-role="controlgroup" class="ui-btn-right"> <a href="#page1" data-role="button">Next</a> 
        </div>
    </div>
</div>
<div data-role="page" id="page1" data-theme="a">
    <div data-role="content">
        <center>
             <h3><a href="#pageHome" data-role="none"><img src="images/logo.png" /></a></h3>

        </center>
        <div class="dydivarr1"></div>
        <br />
        <div data-role="controlgroup" class="ui-btn-right"> <a href="#page2" data-role="button">Next</a> 
        </div>
    </div>
</div>
<div data-role="page" id="page2" data-theme="a">
    <div data-role="content">
        <center>
             <h3><a href="#pageHome" data-role="none"><img src="images/logo.png" /></a></h3>

        </center>
        <div class="dydivarr2"></div>
        <br />
        <div data-role="controlgroup" class="ui-btn-right"> <a href="#page3" data-role="button">Next</a> 
        </div>
    </div>

JavaScript

$('input[type=button]').click(function () {
    var lastSection = $('[data-role="page"]:last');
    var newSection = lastSection.clone(false);
    newSection.attr('id', 'setthenewid');
    $('div[class^=dydivarr]', newSection).attr('class', 'newclass');
    $('.ui-btn-right a', newSection).attr('href', 'newurlmap');
    lastSection.after(newSection);
});