jQuery Hello World alert example

This section guides you  to create a program which display "Hello World" alert box using jQuery. This application will use the JavaScript alert() method to display the "Hello World" message.

In this example you will learn how to write JavaScript using jQuery. When user clicks on the button "Click Me", the alert message is displayed to the user.

The following method is used to attached the click event to the button:

$("#cl").click(function(){....})

The above code of jQuery handles the button click event and then executes the JavaScript defined in the curly braces{}. In the curly braces we have defined the JavaScript alert() method.

Hello world alert box example(HelloAlert.html)

Here is the video instruction of running the example program - How to display alert message in jQuery?

Description of the program

For using jQuery script ,we write it inside <script> tag. The below code checks whether the page loading is finished (DOM elements are ready or fully loaded) and if page loading is finished then it executes the code in the block.

$(document).ready(function(){
// Your code here
});

The Html page contains a button named "cl", when click event is triggered on this element , it will display a alert box showing message "Hello World". The "alert()" function of jQuery creates a alert box having provided message.

$("#cl").click(function(){
alert("HELLO WORLD!");
}); OUTPUT

When you click on button , it will display :




Download Source Code

See here to see online demo

Learn from experts! Attend jQuery Training classes.