Introduction to jQuery

Updated on: September 18, 2018
  • jQuery is small, fast and featured rich javascript library.

  • It works on multiple browsers

  • It helps in DOM manipulation, event handling, and showing animations on the web page.

  • It can be used to upload file functionality and making API calls through ajax

How to add jQuery to html web page :

You can add jQuery to your web page by adding jQuery .js file.

Following is the sample HTML and it’s output after adding jQuery



<title>Sample jQuery Application</title>

<script src=""></script>



  $('body').html('<h1>Sample jQuery Application</h1>');







I have used CDN path of Google to add jQuery to our web page.

The output of above program is :

DOM Manipulations :

jQuery uses selectors for DOM manipulation.

Following are the selectors in jQuery:

  • Element selector

  • ID selector

  • Class selector

Event Handling :

jQuery handles mouse click, mouse hover, mouse move events. Following is the button click event, “btnShowProducts”, on click of the button “productListDiv” div will get visible on the DOM.




Ajax Implementation :








   console.log(‘error occurred’);