Issue with tabs not displaying

Issue with tabs not displaying

I am using the following code (copied directly) and using my htm pages. The tabs do not display.


  1. <!DOCTYPE html>
    <html lang="en">
    <head>
  2. <title id='Description'>TRANSPORTATION</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <link rel="stylesheet" href="/resources/demos/style.css">
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  3. <script>
  4.   $( function() {
      $( "#tabs" ).tabs();
      }
     );
  5. </script>
  6. </head>
  7. <body class='default'>
  8. <div id="tabs">
     <ul>
      <li><a href="schedule.htm">SCHEDULE</a></li>
      <li><a href="riders.htm">RIDERS</a></li>
      <li><a href="drivers.htm">DRIVERS</a></li>
      <li><a href="addresses.htm">ADDRESS</a></li>   
      <li><a href="billing.htm">BILLING</a></li>
      <li><a href="recon.htm">RECONCILE</a></li>
      <li><a href="congregates.htm">STARS TRANSPORTATION</a></li>   
      <li><a href="maint.htm">MAINTENANCE</a></li>  
     </ul>
    </div>  
  9. </body>
    </html>