JSFiddle - React, Tailwind, and code Playground

by Ahmad Baktash Hayeri

HTML

<div id="subregionListPage" data-role="page">
    <div data-role="header" data-position="fixed">
        <h1>Select Sub Region</h1>
    </div>
    <div data-role="content">
         <ul id='subregions' data-role="listview"></ul>
    </div>      
</div>

JavaScript

$(document).on('pagecreate', '#subregionListPage', function(event){

    var output = $('#subregions');
            var data = ['Kabul', 'Ghazni', 'Bamyan'];
            var out = '';
            $.each(data, function(i,item){ 
                output.append('<li><a href="subregions.html">' + item + '</a></li>');
            
            output.trigger('create');
            output.listview('refresh');
    });
});

String.prototype.capitalize = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
} 
String.prototype.capitalize = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

$.urlParam = function(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    if (results==null){
       return null;
    }
    else{
       return results[1] || 0;
    }
}