JSFiddle - React, Tailwind, and code Playground

HTML

<section id="data-animation-grid">
        <div class="animation__item">
                <img src="http://www.diabetesbluecircle.org/img/diabetesbluecircle.png">
        </div>
        <div class="animation__item">
                <img src="http://www.diabetesbluecircle.org/img/diabetesbluecircle.png">
        </div>
</section>

CSS

.animation__item img {
    width: 50px;
    height: 50px;
}

.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:3s;-moz-animation-duration:3s;-ms-animation-duration:3s;-o-animation-duration:3s;animation-duration:3s;}.animated.hinge{-webkit-animation-duration:3s;-moz-animation-duration:3s;-ms-animation-duration:3s;-o-animation-duration:3s;animation-duration:3s;}@-webkit-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
	}	25% {
		-webkit-transform: scale(.95);
	}
	
	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
	}
	
	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
	}	
}

@-moz-keyframes bounceOut {
	0% {
		-moz-transform: scale(1);
	}
	
	25% {
		-moz-transform: scale(.95);
	}
	
	50% {
		opacity: 1;
		-moz-transform: scale(1.1);
	}
	
	100% {
		opacity: 0;
		-moz-transform: scale(.3);
	}	
}

@-o-keyframes bounceOut {
	0% {
		-o-transform: scale(1);
	}
	
	25% {
		-o-transform: scale(.95);
	}
	
	50% {
		opacity: 1;
		-o-transform: scale(1.1);
	}
	
	100% {
		opacity: 0;
		-o-transform: scale(.3);
	}	
}

@keyframes bounceOut {
	0% {
		transform: scale(1);
	}
	
	25% {
		transform: scale(.95);
	}
	
	50% {
		opacity: 1;
		transform: scale(1.1);
	}
	
	100% {
		opacity: 0;
		transform: scale(.3);
	}	
}

.bounceOut {
	-webkit-animation-name: bounceOut;
	-moz-animation-name: bounceOut;
	-o-animation-name: bounceOut;
	animation-name: bounceOut;
}
@-webkit-keyframes lightSpeedIn {
	0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }
	100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
}

@-moz-keyframes lightSpeedIn {
	0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% {...

JavaScript

/* SAniMan
	
	Simple Animation Manager 

	- Danillo2k

		Queue idea by: Stephen Morley 
		getAttributes: stackoverflow: gilly3
		getAttributes: stackoverflow: kevinfahy

		This is just something i needed, it aint perfect, but if someone can use this, feel free to do so.
	*/

var AnimationManager = function(){
        this.defaults = {
                USE_TRANSITION: 'animation',
                EFFECT: 'slide' // define standard animation
        };
        this.queue  = [];
};

AnimationManager.prototype.animate = function () {
        var options = this.dequeue();

        if(options && options.el) {

                // init
                this.el = options.el;
                this.effect = (options.effect)? options.effect : this.defaults.EFFECT;
                this.reverseAnimation = (options.reverse) ? 'reverse' : '';
                this.animationType = (options.useransition)? options.useTransition : this.defaults.USE_TRANSITION;
                this.detectedTransitionEnd = this.detectTransitionEnd();

                // start
                this.animationType =(options.useransition)? options.useTransition : this.defaults.USE_TRANSITION;

                // add
                this.addListeners();
                this.el.classList.add('animated', this.effect);


        } else {
                return false;
        }
};

AnimationManager.prototype.addListeners = function() {
        this.endAnimate = this.transitionEnd.bind(this);
        if (this.animationType === 'transition') {
                this.el.addEventListener(this.detectedTransitionEnd, this.endAnimate, false);
        } else {
                this.el.addEventListener(this.detectedTransitionEnd, this.endAnimate, false);
        }
};

AnimationManager.prototype.removeListeners = function() {
        if (this.animationType === 'transition') {
                this.el.removeEventListener(this.detectedTransitionEnd, this.endAnimate, false);
        } else {
               ...