Want to update text in <p> element

Want to update text in <p> element

Hello, I am a  JQuery newbie. I have been trying to perform a simple task of updating the text in <p> element after the page loads. Here is a very simple script and code I am using
  2. <!DOCTYPE html>
  3.  <html>
  4.       <head>
  5.          <style>
  6.              p { color : blue; margin : 8px; }
  7.          </style>
  8.          <script src = "jquery-1.10.1.min.js"></script>
  9.          </script>
  10.          <title>My JQuery Tests </title>
  11.      </head>
  12.       <body>
  13.          <p>  My JQuery Tests On This Page </p>
  14.          <script src = "application.js"></script>
  15.      </body>
  16.   </html>
I have downloaded the jquery-1.10.1.min.js and placed it in the directory where the above file is present. The application.js is as follows
  2. $(document).ready(function()i{
  3.     ("p").text("Changed the Text through JQuery ! Huuray");
  4. });
I have tried to write the script in the original file but it didn't work. Please help me understand where I am going wrong. 

Thanks.