How to propagate jQuery Mobile events when a popup is open?

It seems like no events are being propagated to the content div while a popup is open.

I'm using the popup as an alert message and I'd like to keep it open while the user performs other tasks on the page.

Live example: http://jsfiddle.net/wvVmT/703/

I want the alert to come up if you click on the red area even after the popup is open.

HTML:

<div data-role="page">
    <div data-role="content" id="content" style="background-color:red">
        content
        <a href="#" data-role="button" data-rel="popup" id="message-button">Message</a>
        <div data-role="popup" id="message-popup" data-history="false" data-dismissible="false">popup</div>
    </div>
</div>

JS:

$(function() {
  $( '#message-button' ).click(function()
    {
      $( '#message-popup' ).popup( 'open' );
    }
  );
  $( '#content' ).click(function()
    {
      alert('content');
    }
  )
});

As Omar mentioned, the screen associated to the pop-up must be removed.

He suggested removing the screen for all pop-ups:

$('.ui-popup-screen').remove();

But actually, the moment a pop-up is created, an element with the same ID followed by -screen is created. So you can delete just that one to keep screens for all others. In my example:

$('#message-popup-screen').remove();

And doing it once is enough, so you don't need to do it each time the pop-up is opened like in his example ;)