Tabs Widget not working when HREF refers to an HTML file

Tabs Widget not working when HREF refers to an HTML file

Hello,
I have a minimal sample of code with just 2 tabs.
When I set the HREF of one of the tabs to be an HTML file, no content is loaded in that tab.
The other tab is just fine.

Any ideas?

Thanks
David
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="en">
  4.     <meta charset="UTF-8">
  5.     <link href="css/jquery-ui.css" rel="stylesheet">
  6.     <script type="text/javascript" src="scripts/jquery-1.11.2.js"></script>
  7.     <script type="text/javascript" src="scripts/jquery-ui.js"></script>
  8.     <script type="text/javascript">
  9.         $( document ).ready(function() {
  10. $('#maintabset').tabs();
  11.         });
  12.     </script>
  13. </head>
  14. <body >
  15. <div id="maintabset">
  16.     <ul>
  17.         <li><a href="timesheet_tab.html" ><span>Timesheet</span></a></li>
  18.         <li><a href="#tab_project_categories" id="tab_for_project_categories">Project Categories</a></li>
  19.     </ul>
  20. <div id="tab_project_categories">
  21.         Tab for Project Categories goes here
  22.     </div>
  23. </div>
  24. </body>
  25. </html>