jQueryMobile - First Code not working

jQueryMobile - First Code not working

Hi All,

I have just started working on jQueryMobile and tried to run below code in EditPlus and Sublime Text both editors but it is not showing the result like it is described in the below video URL on YouTube:


Here is the code which I have used:

These CSS and JS files are placed in the same folder. I am getting the output as shown in Example.png in the attachment.

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <script type="text/javascript" src="jquery-3.2.1.min.js"></script>
  <link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.5.min.css">
  <script type="text/javascript" src="jquery.mobile-1.4.5.min.js"></script>
  </head>
 <body>
  
<div data-role="page" id="page">
<div data-role="header">
<h1>Page One</h1>
</div>

<div data-role="content">
Content
</div>

<div data-role="footer">
<h4>Page Footer</h4>
</div>

</div>

 </body>
</html>

Could you please help what could be the problem here?

Thanks,
Abhishek