Displaying a survey creation form:
<!-- HTML structure -->
<div data-role="page" data-theme="b">
<div data-role="header">
<h1>
Create Survey
</h1>
</div>
<div id="main" data-role="main" class="ui-content">
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<div class="ui-field-contain">
<div class="ui-grid-a">
<label for="addQ" class="ui-hidden-accessible">Add Question</label>
<input type="button" value="Add Question" id="addQ" class="smallerBtns">
...
// JavaScript code appending content into the container div:
$(document).bind("pageinit",function(){
$("#container").empty();
//Reset qCount
qCount = 0;
//jquery Add Question event
$(document).undelegate('#addQ', 'click').delegate('#addQ','click', function() {
//Increment question counter
qCount++;
$('\
<div id="newQ' + qCount + '">\
<span id="num' + qCount + '" class="nums">' + qCount + '.</span>\
...
').hide().appendTo("#container").fadeIn(1000).enhanceWithin();
})
})
...