How to add jQuery code to HTML file ? Last Updated : 31 May, 2023 Comments Improve Suggest changes Like Article Like Report In this article, we will see how to add jQuery code to an HTML file. You can easily add jQuery to HTML by using several methods, like adding jQuery from CDN or directly downloading jQuery files and including them in your projects. Several methods are discussed in this article. Methods: Download and include the jQuery fileIncluding jQuery from CDN. Approach1: Download and include the jQuery file Follow the information below to include jQuery in your HTML file. Use this link to download the jQuery file from the official jQuery website. ( download compressed or uncompressed files according to your need).After downloading, just move the downloaded file into the HTML file to which you want to add your jQuery.Finally, use the below syntax to include jQuery in the HTML file. i.e. add jQueryfile name between script tags.<script type="text/javascript" src="jquery-3.5.1.min.js"> </script> Example: In this example, we will use the above approach HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { $("h2").html("Complete Portal for Geeks</b>"); }); }); </script> </head> <body> <center> <h2>GeeksforGeeks</h2> <button>Click here</button> </center> </body> </html> Output: Approach 2: Follow the step below to include jQuery in the HTML file. In this, you just need to add the link below with the script tag to your HTML file, whether CDN is provided by Google or Microsoft.Google CDN <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> Microsoft CDN <script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js'></script> Example: In this example, we will use the above approach. HTML <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <title>Added Jquery into HTML</title> <style> h1 { color: green; } </style> </head> <body> <center> <h1> Welcome to GeeksforGeeks </h1> <button id="trigger"> Click me </button> <h3 id="demo"></h3> <script type="text/javascript"> $(document).ready(function () { $("#trigger").click(function () { $("#demo").html("Complete portal for Geeks"); }); }); </script> </center> </body> </html> Output: Comment More infoAdvertise with us Next Article How to add jQuery code to HTML file ? aksrathod07 Follow Improve Article Tags : Web Technologies HTML JQuery jQuery-Methods HTML-Questions jQuery-Questions +2 More Similar Reads How to create an HTML element using jQuery ? In this article, we will see how to create an HTML element using jQuery. To create and append the HTML element, we use the jQuery append() method. The jQuery append() method is used to insert some content at the end of the selected elements. Syntax: $(selector).append( content, function(index, html) 2 min read How to load external HTML file using jQuery ? In this article, we will learn how to load an external HTML file into a div element. The following jQuery functions are used in the example codes. ready(): The ready event occurs when the DOM (document object model) has been loaded.load(): The load() method loads data from a server and gets the retu 3 min read How to Create an index.html File? Creating an index.html file is a fundamental step in HTML programming and website development. This file serves as the backbone of a basic HTML webpage. In this article, we will explore four straightforward methods to create an index.html file, which is important for building and serving web content 3 min read How to Load an HTML File into Another File using jQuery? Loading HTML files into other HTML files is a common practice in web development. It helps in reusing HTML components across different web pages. jQuery is a popular JavaScript library, that simplifies this process with its .load() method. Approach 1: Basic Loading with .load() MethodThe .load() met 2 min read How to execute jQuery Code ? jQuery is an open-source feature-rich Javascript library that is designed for the simplification of HTML DOM Tree traversal & manipulation, event-handling & CSS animation. It is quite popular for its features like light-weight, fast, small, etc, that make it easier to use. The purpose of usi 4 min read How to run a code on click event in jQuery ? In this article, we will see how to run the code after clicking on an event. To run the code after clicking an event, we use the click() method. The click() method is used to run the code when a click event occurs. The click() method to attach a click event handler to selected elements. Inside the h 1 min read How to append HTML code to a div using JavaScript ? The ability to append HTML code to a <div> Using JavaScript helps enhance user experience by enabling dynamic content updates without reloading the page. This technique is widely usedâover 85% of modern websites implement JavaScript DOM manipulation to create smoother and more interactive web 6 min read How to create a div element in jQuery ? There are various method to create HTML element inside an HTML document using JQuery. But the simplest of all is append() and prepend() method. Method 1: Using prepend() Method: The prepend() method is used to insert a specified content at the beginning of the selected element. Example: This example 2 min read How to use jQuery to Search and Replace HTML elements? Using jQuery, you can dynamically search and replace HTML elements on a webpage. By selecting elements and binding actions to events, you can manipulate their content or structure in response to user interactions or other triggers ApproachIntegrate the jQuery library hosted on a content delivery net 2 min read How to embed PHP code in an HTML page ? PHP is the abbreviation of Hypertext Preprocessor and earlier it was abbreviated as Personal Home Page. We can use PHP in HTML code by simply adding a PHP tag without doing any extra work. Example 1: First open the file in any editor and then write HTML code according to requirement. If we have to a 2 min read Like