jquery mobile: Object [object Object] has no method 'jqmData' - jquery-mobile

Question

I am relatively new to Jquery and Jquery mobile, I was just trying and tutorial to add Loading animation on the page, I was simply following the code provided in one of the demos. However I am getting the following error.
Uncaught TypeError: Object [object Object] has no method 'jqmData'
I am using the following code snippet and javascript
<button class="show-page-loading-msg ui-btn-right" data-icon="refresh" data-theme="d" data-textonly="false" data-textvisible="true" data-msgtext="Loading..." data-inline="true">Refresh</button>
<script>
window.$ = window.jQuery = WLJQ;
$( document ).on( "click", ".show-page-loading-msg", function() {
var $this = $( this ),
theme = $this.jqmData( "theme" ) || $.mobile.loader.prototype.options.theme,
msgText = $this.jqmData( "msgtext" ) || $.mobile.loader.prototype.options.text,
textVisible = $this.jqmData( "textvisible" ) || $.mobile.loader.prototype.options.textVisible,
textonly = !!$this.jqmData( "textonly" );
html = $this.jqmData( "html" ) || "";
$.mobile.loading( "show", {
text: msgText,
textVisible: textVisible,
theme: theme,
textonly: textonly,
html: html
});
setTimeout(WL.Client.reloadApp, 5000);
$.mobile.loading( "hide" );
});
</script>
The error is pointing to this line in the javascript theme = $this.jqmData( "theme" )
when i debugged on browser console i was able to see the button data values assigned to the $this variable
Please advice,

Answer 1

if you run the following:
console.log($.mobile.version);
... and check the console. Does it print out the version? Or does it say it is undefined?
If it is undefined, check if you have correctly referenced jQuery and jQuery mobile libraries, something like this:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css">
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

Answer 2

Try to put your script into the 'mobileinit' event handler (or a page event handler), like:
<script src="js/jquery-2.0.3.js"></script>
<script>
window.$ = window.jQuery = WLJQ;
$(document).on('mobileinit', function() {
// your script
});
</script>
<script src="jqueryMobile/jquery.mobile-1.3.1.js"></script>
NOTE the sequence of the script