JSFiddle - React, Tailwind, and code Playground

HTML

<div id="slide1"></div>
<div id="slide2"></div>

CSS

div {
    position:absolute;
    left:0px;
    top:0px;
    background:red;
    width:100%;
    height:300px;
    -webkit-transition: all 0.4s linear;
}
#slide2 {
    background:blue;
    -webkit-transform: translateX(100%);
}

JavaScript

$('#slide2')
        .css('-webkit-transition','none')
        .css('-webkit-transform','translateX(-100%)');
    $('#slide2').css('-webkit-transform');

    $('#slide1').css('-webkit-transform','translateX(100%)');

    $('#slide2')
        .css('-webkit-transition','all 0.4s linear')
        .css('-webkit-transform','translateX(0%)');