I have multiple divs, each with a different animation type, delay etc.

I would like them all to load with the click of a single button.

I am able to get the button to start the animation of a single div by using data-mdb-animation-target="#..."

However I would like this button to start the animation of multiple divs

what is the syntax for having multiple data-mdb-animation-targets???

animation-target="#divid1 #divid2 #divid3"???

see below html

<!-- Submit button -->
<div class="container-fluid d-flex justify-content-center p-5">
    <button data-mdb-ripple-init type="submit" class="btn btn-primary" id="load-report-button" data-mdb-animation-init data-mdb-animation-target="#left-headline">Load Dashboard</button>   
</div>

<!-- Headline Tiles -->
<div class="row">
    <div class="col-xl-4 col-lg-4 col-md-12 pb-5">
        <div id="left-headline" class="container-fluid p-5 shadow-lg rounded-5 d-flex justify-content-center align-items-center" style="height: 25vh;" data-mdb-animation-init data-mdb-animation="fade-in-down" data-mdb-animation-start="onClick">
            <p>Headline 1</p>
        </div>
    </div>
    <div class="col-xl-4 col-lg-4 col-md-12 pb-5">
        <div id="middle-headline" class="container-fluid p-5 shadow-lg rounded-5 d-flex justify-content-center align-items-center" style="height: 25vh;" data-mdb-animation-init data-mdb-animation="fade-in-down" data-mdb-animation-start="onClick" data-mdb-animation-delay="500">
            <p>Headline 2</p>
        </div>            
    </div>
    <div class="col-xl-4 col-lg-4 col-md-12 pb-5">
        <div id="right-headline" class="container-fluid p-5 shadow-lg rounded-5 d-flex justify-content-center align-items-center" style="height: 25vh;" data-mdb-animation-init data-mdb-animation="fade-in-down" data-mdb-animation-start="onClick" data-mdb-animation-delay="1000">
            <p>Headline 3</p>
        </div>            
    </div>
</div>