title: Unable to get JQuery-Mobile collapsible expand/collapse event to execute
body: <p>I have the following demo HTML file that I am tying to use the JQuery-Mobile collapsible expand/collapse events and I am not able to get the JavaScript event to fire.  I am basing this off the JSFiddle example here: <a href="http://jsfiddle.net/6txWy/" rel="nofollow">http://jsfiddle.net/6txWy/</a></p>
  
  <p>I feel like I am just overlooking something simple but here is my HTML file:</p>
  
  <pre><code>&lt;html&gt; 
  &lt;head&gt; 
    &lt;title&gt;References&lt;/title&gt;
  
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; 
    &lt;meta name="apple-mobile-web-app-capable" content="yes"&gt;
    &lt;meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"&gt;
  
    &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /&gt;
    &lt;link rel="stylesheet" href="css/main.css" /&gt;
  
    &lt;script src="http://code.jquery.com/jquery-1.6.4.min.js"&gt;&lt;/script&gt;
    &lt;script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"&gt;&lt;/script&gt;  
  
    &lt;script type="text/javascript"&gt;
    $('#my-collaspible').bind('expand', function()
    {
      alert('Expanded');
    }).bind('collapse', function () {
      alert('Collapsed');
    });
    &lt;/script&gt;
  &lt;/head&gt; 
  
  &lt;body&gt;
    &lt;div data-role="page"&gt;
        &lt;div data-role="content"&gt;
            &lt;div data-role="collapsible" id="my-collaspible"&gt;
                &lt;h3&gt;My Title&lt;/h3&gt;
                &lt;p&gt;My Body&lt;/p&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The collapse and expand work but the alerts are never fired.</p>
  
  <p>Thanks!
  Flea</p>