How to insert jQuery into an HTML page



jQuery is a free, open-source JavaScript library designed to simplify HTML DOM tree traversal and manipulation, event handling, CSS animation, and Ajax. It is using the permissive MIT License.


As of May 2019, jQuery is used by 73% of the 10 million most popular websites and is undoubtedly amazing and easy to use and i personally call it easy-javascript, you can take my naming for that.

So if you are wanting to start using jQuery in your HTML pages, then that's absolutely a nice, and unregretful  thing to do. And am going to show you how to do just that.

There are two options to choose from, when you are about installing the jQuery library. They are:
  1. Downloading and hosting the jQuery library in your local machine (computer).
  2. Using a CDN (content delivery network).

1. Downloading and hosting the jQuery library in your computer.

If you want to download and host jQuery from withing your local machine, then you have to download the library. This is an easy task, so grab your chilled juice and follow the easy steps below to get it done.

#step 1:
 Visit http://jquery.com/download, right-click on any of the download links, and click on Save Link As in the pop-up menu.

#Step 2:
 Save the download file to your local directory (this should be your project's folder) please, do ensure it's in the same folder as the HTML file you want to use it on, otherwise this won't work out.

#Step 3:
 Open the HTML file you want to use jQuery on, and add the following script tag to the <head> section.


Ensure the name of the file you downloaded corresponds with the name in the src attribute of the <script> tag.

#Step 4:
  Sip your Juice if you have it with you 🥤🍹.

Now you have successfully installed jQuery library into your HTML page and you are now ready to start using jquery methods right away.

2. Using a CDN (content delivery network).

You might not want to host the jQuery library in your local machine for some or no reason, if so, smile because i got you another option.

All you have to do is to use an online version of the jQuery library, hosted by Google.

Now instead of downloading the jQuery library to your computer, insert the following script tag in the head section of the HTML file you want to use jQuery in, and you are good to go.


This method is the most recommended way as it is faster to setup, it is stable, and it can reduce your website's bandwidth usage.

If you still can't do the setup, let me know in the comment section. Happy Coding!!

Post a Comment

0 Comments