JSFiddle - React, Tailwind, and code Playground

HTML

<a href="javascript://" onclick="$('.example_block').show();">Показать элемент</a><br />
<a href="javascript://" class="hide_link">Скрыть элемент</a>
<div class="example_block"></div>

CSS

@keyframes example_animation {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@-webkit-keyframes example_animation {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@-webkit-keyframes example_animation_hide {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }    
}

@keyframes example_animation_hide {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        opacity: 0;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }    
}

.example_block {
    display: none;
    width: 300px;
    height: 150px;
    position: absolute;
    margin: auto;
    top: 0; left: 0; right: 0; bottom: 0;
    background: Red;
    animation: example_animation 500ms;
    animation-fill-mode: forwards;
    -webkit-animation: example_animation 500ms;
    -webkit-animation-fill-mode: forwards;
}

.hide-class {
    animation: example_animation_hide 500ms;
    animation-fill-mode: forwards;
    -webkit-animation: example_animation_hide 500ms;
    -webkit-animation-fill-mode: forwards;   
}

JavaScript

$('.hide_link').on('click', function() {
    $('.example_block').on('animationend webkitAnimationEnd MSAnimationEnd oAnimationEnd', function(){
        if ($(this).hasClass('hide-class')) $(this).hide().removeClass('hide-class');
    })
    .addClass('hide-class');
});