JSFiddle - React, Tailwind, and code Playground

by Adambasszer

HTML

<!-- Home -->
		<div data-role="page" id="mainPage">
			<div data-role="header" data-position="fixed">
				<h1>CsodaNav header</h1>

			</div>
			<!-- /header -->
			<div data-role="content"></div>
			<!-- /content -->
			<div data-role="footer" data-position="fixed">
				<h4>CsodaNav footer</h4>

			</div>
			<!-- /footer -->
		</div>

JavaScript

//ez azert kell, mert a jQueryMobile trukkosen egy oldalra
//tolti be azt az oldalt is, amire el akar navigalni.
//Amikor betoltodik az Ăşj oldal, ez hivodik meg.
//alert("kurvaanyad");
$(document).on('pageshow', '.ui-page', function() {
	var collapsibleTheme = 'a';
	var collapsibleContentTheme = 'e';
	if ($("#mainPage").length > 0) {
		console.log("Itt vagy");
		$.getJSON("http://standinghollow.zz.mu/getActiveDeliveries.php", function(data) {
			console.log(data);
			var col = '<div data-role="collapsible-set" data-theme="' + collapsibleTheme + '" data-content-theme="' + collapsibleContentTheme + '">';
			$.each(data, function(index, value) {
				col += '<div data-role="collapsible" data-collapsed="true">';
				col += getHeaderString(value.address);
				col += getCheckboxString(value.id);
				col += getButtonString(value.id);
				col += '</div>';
			});
			col += '</div>';
			//$("#mainPage").find('div[data-role=collapsible]').collapsible({theme:'d',refresh:true});
			$('[data-role=content]').append(col);
			$('[data-role=collapsible-set]').collapsibleset().trigger('create');
			//$('#mainPage').page('destroy').page();

		});
	}
});

function getHeaderString(title) {
	var str = '<h3>' + title + '</h3>';
	return str;
}

function getCheckboxString(id) {
	var str = '<div id="checkboxes' + id + '" data-role="fieldcontain">';
	str += '                <fieldset data-role="controlgroup" data-type="vertical">';
	str += '                    <legend>';
	str += '                        Sikeres kézbesítés:';
	str += '                    </legend>';
	str += '                    <input id="checkbox' + id + '" name="" data-theme="c" type="checkbox">';
	str += '                    <label for="checkbox' + id + '">';
	str += '                        Option';
	str += '                    </label>';
	str += '                </fieldset>';
	str += '            </div>';
	return str;
}

function getButtonString(id) {
	var str = '<a id="button' + id + '" data-role="button"...