Skip to Content
jQuery Setup
Why jQuery?

JavaScript is the most widely-used language for adding dynamic behavior to web pages. The JavaScript community contributes to a collection of libraries that extend and ease its use. In this course, you will learn about jQuery, a JavaScript library that makes it easy to add dynamic behavior to HTML elements.

Let’s look at an example of how JavaScript is used to add dynamic behavior to a web page (don’t worry about understanding the code).

const login = document.getElementById('login'); const loginMenu = document.getElementById('loginMenu'); login.addEventListener('click', () => { if( === 'none'){ = 'inline'; } else { = 'none'; } });

In this example, JavaScript is used to apply behavior to an HTML element with id login. The behavior allows a user to click a LOGIN button that toggles a login form.

The code below accomplishes the same behavior with jQuery.

$('#login').click(() => { $('#loginMenu').toggle() });

In this example, the same toggle functionality is accomplished using just three lines of code.



Copy the jQuery code below and paste it into main.js:

$('.login-button').on('click', () => { $('.login-form').toggle(); });

Run the code. You can click the LOGIN button see it in action!

Folder Icon

Sign up to start coding

Already have an account?