Initialising a button on the page_container gives rubbish markup.

Initialising a button on the page_container gives rubbish markup.

The markup below throws a div around the Yes button & give a terrible ui (shown at the bottom) when the button is initialised using:
      
  1.       var w = $("#confirmDeleteAccountDialog .deleteConfirmationButton");
  2.       if (w.data("mobileButton") === undefined) {
  3.             w.button();
  4.       }
  5.       w.button("enable");

How do I go about NOT having the div around the anchor created? (Line 21)

I've omitted all the script stuff.

Thanks for looking, N

  1. <html>
  2. <head></head> 
  3. <body>   
  4. <!-- Mobile page -->
  5. <div id="crmMyAccountsDetailPage" data-role="page" class="type-interior" style="background: #E5E5E5">
  6. <!-- Page container -->
  7. <div id="page_container" style="display: inline">
  8. <!-- Header -->
  9. <div id="accountsMainHeader">&nbsp;</div>
  10. <!-- End of header -->                
  11. <div data-role="content" class="ui-content" role="main">
  12. <div id="confirmDeleteAccountDialog" data-role="popup" data-theme="a" data-corners="true">
  13. <form>
  14. <div data-role="header" data-theme="d">
  15. <h1>Are you sure?</h1>
  16. </div>
  17. <div data-role="main" style="padding: 4px;">
  18. <p id="deleteEntityDescription">&nbsp;</p>
  19. <hr style="margin: inherit -4px;" />
  20. <div style="float: right;">
  21. <div class="ui-btn ui-input-btn ui-btn-a ui-corner-all ui-shadow ui-btn-inline"><a class="deleteConfirmationButton ui-link ui-btn ui-btn-a ui-btn-inline ui-shadow ui-corner-all" data-role="button" data-inline="true" data-theme="a" href="#" role="button">Yes</a></div>
  22. </div>
  23. <div style="clear: both;"></div>
  24. </div>
  25. </form>
  26. </div>
  27. </div>
  28. </div>
  29. </div>
  30. </body>
  31. </html>