JSFiddle - React, Tailwind, and code Playground

HTML

<p>●●●</p>
<div class="box">box</div>

CSS

.box {
  transition: 1s;
  background: gray;
}
.box.is_red {
  background: pink;
}
.box.is_blue {
  background: skyblue;
}

JavaScript

$(function(){

	changeBox( null );   // １回目
	// changeBox( 'show' ); // ２回目
	setTimeout( ()=>{ changeBox( 'show' ); }, 5000 ); // ２回目

	function changeBox( type ) {

		if ( type == 'show' || type === 'up' || type === 'down' ) {
			$( 'p' ).text( 'あああ' );
		}

		$( '.box' ).addClass( type === null ? 'is_red' : 'is_blue' );

		if ( type === null ) {
			$( '.box' ).on('transitionend', function() {
				$( 'p' ).text( 'いいい' );
			});
		}

	}

});