jQuery Mobile “mobileinit” Event

Unlike other jQuery projects, such as jQuery and jQuery UI, jQuery Mobile automatically applies many markup enhancements as soon as it loads (long before document.ready event fires). These enhancements are applied based on jQuery Mobile’s default configuration, which is designed to work with common scenarios, but may or may not match your particular needs. Fortunately, these settings are easy to configure.

When the jQuery Mobile starts to execute, it triggers a mobileinit event on the document object, to which you can bind to apply overrides to jQuery Mobile’s defaults.

That the mobileinit event works  you need to follow this sequence:

  1. Load jQuery
  2. Define mobileinit event
  3. Load jQuery Mobile
Example: