JSFiddle - React, Tailwind, and code Playground
by sebababi
HTML
<div data-role="collapsible-set" data-theme="c" data-content-theme="c" data-inset="false">
<div data-role="collapsible">
<h2>
<img class="thumbNail" src="http://www.uglymongrel.com/jqm/faq/docs/demos/_assets/img/album-bb.jpg" style="float:left;" />
Mailbox<BR>
Address<BR>
Rating
<a href="#map" id="show-content" class="onlineButton"data-theme='a' style="float:right;"><input type='button' value='BOOK IT' data-inline='true' data-icon='gear'/></a>
</h2>
<ul data-role="listview" style="padding:5px;" data-icon="false">
<li><a href="#">Inbox</a>
</li>
</ul>
</div>
<!-- /collapsible -->
</div>
<!-- /collapsible-set -->
CSS
.ui-collapsible-heading .ui-icon {
display: none;
}
.thumbNail {
padding:0;
margin:0;
left:0;
top:0;
width:100px;
padding-right:5px;
float:left;
clear:both;
}
.onlineButton .ui-btn {
background: #00ff00;
color: #000;
}
JavaScript
$(document).on('pagebeforeshow', '#index', function () {
$('#show-content').on('click', function (e) {
alert('here');
alert($('#ListItem').find('h2 p').text());
e.stopPropagation();
e.stopImmediatePropagation();
});
});
$('#show-content').on('click', function (e) {
alert('here');
alert($('#ListItem').find('h2 p').text());
e.stopPropagation();
e.stopImmediatePropagation();
});