Skip to content
Related Articles

Related Articles

How to count the number of times a button is clicked using JavaScript ?
  • Last Updated : 29 Jan, 2021
GeeksforGeeks - Summer Carnival Banner

We have given a button, and the task is to count how many times the button is clicked using JavaScript. 

Approach: First, we will create a HTML button and a paragraph element where we display the button click count. When the button is clicked, the JavaScript function called. We declare a count variable and initialize it to 0. When user clicks the button, the count value increased by 1 and display it on the screen.

Example:

HTML




<!DOCTYPE HTML>
<html>
  
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Increment count when button is clicked</title>
</head>
  
<body style="text-align: center;">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
  
    <h4>
        How to count the number of 
        times a button is clicked?
    </h4>
  
    <button id="btn">Click Here!</button>
  
    <p>
        Button Clicked <span 
        id="display">0</span> Times
    </p>
  
    <script type="text/javascript">
        var count = 0;
        var btn = document.getElementById("btn");
        var disp = document.getElementById("display");
  
        btn.onclick = function () {
            count++;
            disp.innerHTML = count;
        }
    </script>
</body>
  
</html>

Output:

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :