jQuery click() Event

The click event is called on click the selected element.

Syntax of click() Event

$(selector).click(function)

The selector is the element on which click event trigger. The function is an optional parameter. This function is called when the click event occurs.

Example

<p>Click on this text.</p> 
<script>
$(document).ready(function(){
$("p").click(function(){  
alert("This text is clicked.");  
});  
});
</script>

Output of the above code

Click on this text.

In the above example, an alert message displayed on click the paragraph.

Example

<style>
.sliderDiv {
width: 300px; 
height: 100px;
padding: 10px;
background-color: pink;
font-size: 25px;
}
</style>

<div id="slider" class="sliderDiv">Some Content Here</div>
<button id="slidediv">Click Here</button>

<script>
$(document).ready(function(){
$("button#slidediv").click(function(){  
$("div#slider").slideToggle('slow');
});  
});
</script>

Output of the above code

Some content goes here

In the above example, on click the button of id 'slidediv', the div box is slided up or down.