# Targeting animation when in a Bootstrap carousel-item

**URL:** <https://forum.lottiefiles.com/t/targeting-animation-when-in-a-bootstrap-carousel-item/3560>\
**Category:** Lottie in Web\
**Created:** [October 24, 2022, 9:21am UTC](https://forum.lottiefiles.com/t/targeting-animation-when-in-a-bootstrap-carousel-item/3560 "2022-10-24T09:21:49Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![studio1](https://avatars.discourse-cdn.com/v4/letter/s/779978/32.png) [@studio1](https://forum.lottiefiles.com/u/studio1)\
**Post date:** [October 24, 2022, 9:21am UTC](https://forum.lottiefiles.com/t/targeting-animation-when-in-a-bootstrap-carousel-item/3560/1 "2022-10-24T09:21:49Z")

</div>

I have a Bootstrap site and am trying to add 3 animations to a slider, for each one to play when the slide is visible.  
The first one plays fine because the containing div is visible onload however the other slides are not visible, so trying to target them onclick of the next arrow, with something like below but getting this error because the animation isn’t on the page initially: _Uncaught TypeError: this.player.addEventListener is not a function_

```auto
LottieInteractivity.create({
    player:'#animation-2',
    mode:"cursor",
        actions: [
	    {
		type: "click",
		forceFlag: false
	    }
	]
});

```