<!DOCTYPE html>
<
html
>
<
head
>
<
meta
charset
=
"utf-8"
/>
<
meta
name
=
"viewport"
content=
"
width
=
device
-width,
initial-scale
=
1
">
<
link
rel
=
"stylesheet"
type
=
"text/css"
href
=
"css/jquery.mobile.squareui.css"
/>
<
script
src
=
"js/jquery.js"
></
script
>
<
script
src
=
"js/jquery.mobile-1.4.0.min.js"
>
</
script
>
<
style
>
h3 {
padding: 15px;
margin: 0 auto;
}
</
style
>
</
head
>
<
body
>
<
h2
>Example of Collapsible set</
h2
>
<
div
data-role
=
"collapsible-set"
data-theme
=
"b"
data-content-theme
=
"b"
>
<
div
data-role
=
"collapsible"
data-collapsed-icon
=
"flat-time"
data-expanded-icon
=
"flat-cross"
data-collapsed
=
"false"
>
<
h3
>First Section</
h3
>
<
p
>content for first section </
p
>
</
div
>
<
div
data-role
=
"collapsible"
data-collapsed-icon
=
"flat-calendar"
data-expanded-icon
=
"flat-cross"
>
<
h3
>Second Section</
h3
>
<
p
>content for second section </
p
>
</
div
>
<
div
data-role
=
"collapsible"
data-collapsed-icon
=
"flat-settings"
data-expanded-icon
=
"flat-cross"
>
<
h3
>Third Section </
h3
>
<
p
>content for third section</
p
>
</
div
>
</
div
>
</
body
>
</
html
>