JSFiddle - React, Tailwind, and code Playground

by Kato Richardson

HTML

<fieldset id="text">
    <legend>TEXT</legend>
</fieldset>

<fieldset id="match">
    <legend>MATCH</legend>
</fieldset>

<div id="pagination">1-4&nbsp;of&nbsp;48<span class="divider">|</span><span class="divider">&gt;&gt;</span></div>

CSS

body { background-color: #eee; }

fieldset {
   border: 1px solid black;
   background-color: white;
   margin: 20px;
   padding: 20px;
}

legend { font-weight: bold; padding: 5px }

JavaScript

jQuery(function($) {
   var t = $('#pagination').text();
   var m = t.match(/\d+-(\d+)\sof\s(\d+)/);
   $('#text').append(t);
   $('#match').append( m.join("<br />") ); 
});