You'll need to call .mobiscroll()
on the new content, as it wasn't called with the $(document).ready(
call.
function createNewDestination() {
count++;
//Create new content
var newContent = $('<div/>', {
html: GetHtml()
});
//Add event handlers to new content
newContent.find(".spinner-item").click(spinnerItemClicked);
newContent.mobiscroll().time({theme: 'android-ics light',
display: 'modal', mode: 'scroller', showLabel:false, clearText:'clear', headerText:'Set an arrival time', button3:'clear', button3Text:'Clear' });
return newContent;
}
Additionally, you've got a slight syntax error in getHTML
. You're pulling #scroller
from the main document, not $html
. Change:
$('#check').attr('id', 'check' + count + '');
$('#scroller').attr('id', 'scroller' + count + '');
To:
$html.find('#check').attr('id', 'check' + count + '');
$html.find('#scroller').attr('id', 'scroller' + count + '');