How to Call Multiple JavaScript Functions in onClick Event

Answer: Use the `addEventListener()` Method

If you want to call or execute multiple functions in a single click event of a button, you can use the JavaScript addEventListener() method, as shown in the following example:

Example

Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Call Multiple JavaScript Functions on Click of a Button</title>
</head> 
<body>
    <button type="button" id="myBtn">Click Me</button>
     
    <script>
    // Defining custom functions
    function sayHello(){
        alert("Hello World! sayHello() function executed successfully!");
    }
     
    function sayHi(){
        alert("Hi There! sayHi() function executed successfully!");
    }
     
    // Selecting button element
    var btn = document.getElementById("myBtn");
     
    // Assigning event listeners to the button
    btn.addEventListener("click", sayHello);
    btn.addEventListener("click", sayHi);
    </script>
</body>
</html>

See the tutorial on JavaScript event listeners to learn more attaching multiple event handlers.

Alternatively, you can also call more than one JavaScript function in one onclick event, like this:

Example

Try this code »

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Execute Two JavaScript Function in One onClick Event</title>
</head> 
<body>
    <script>
    // Defining custom functions
    function sayHello(){
        alert("Hello World! sayHello() function executed successfully!");
    }
     
    function sayHi(){
        alert("Hi There! sayHi() function executed successfully!");
    }
    </script>
    
    <button type="button" onclick="sayHello();sayHi();">Click Me</button>
</body>
</html>

The second method however looks simple and easy, but you should avoid placing JavaScript code directly inside HTML element. The first method is better and more preferable.

Related FAQ

Here are some more FAQ related to this topic:

Previous Page Next Page

How to Call Multiple JavaScript Functions in onClick Event

Answer: Use the addEventListener() Method

Example

Example

Related FAQ

About Us

Contact

Interactive Tools

Answer: Use the `addEventListener()` Method