How to add a footer into popup with jQuery mobile?

Question

When I add a footer into the popup dynamically, the footer is inside the popup div in DOM, but in the Google Chrome page, I see the footer is on the bottom of the page.

Do I need some special attributes for the footer div when I add it into a popup?

Answer 1

You just need to tell jQM to enhance the new content after appending it to the footer. eg:

$("#popupDialog").append('<div data-role="footer"><h1>Popup Footer</h1></div>').enhanceWithin();

Here is a DEMO