![Cover image for Call Multiple Functions onclick - [SOLVED]](https://media.dev.to/cdn-cgi/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0ut374c59ydfomfm9pmn.png)
TL;DR Summary
Calling multiple functions with onclick event is very simple (and actually obvious once you hear it).
So the key is to call one function but inside you can call as many other functions you want. Something like this:
function aggregateFunc() {
first();
second();
}
And that's it.
More Details
If you want the full code for calling multiple functions on onclick event then you can copy the code below:
<style>
body {
background-color: bisque;
padding: 300px;
text-align: center;
}
button {
font-size: 30px;
border: 3px solid orangered;
border-radius: 10px;
background-color: orange;
}
</style>
<button onclick="aggregateFunc()">
Call Multiple Functions
</button>
<script>
function first() { console.log('first'); }
function second() { console.log('second'); }
function aggregateFunc() {
first();
second();
}
</script>
And this is all there is to calling multiple functions with onclick event.
Until next time,
Will
Senior Developer & SEO Algo Specialist
Top comments (0)