JSFiddle - React, Tailwind, and code Playground

by ovfiddle

HTML

<div class="testee"></div>
<button class="with">With!</button>
<button class="without">Without!</button>

CSS

/* shameless plug: http://stackoverflow.com/a/11132887/1081234 */
 .notransition {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    -ms-transition: none !important;
    transition: none !important;
}
.testee {
    height: 100px;
    width: 10px;
    background: red;
    transition: width 2s linear;
    -ms-transition: width 2s linear;
    -moz-transition: width 2s linear;
    -webkit-transition: width 2s linear;
    -o-transition: width 2s linear;
}

JavaScript

$('button').on('click', function () {
    //business as usual
    $('.testee').
    toggleClass('notransition', !$(this).hasClass('with')).
    css('width', Math.round(Math.random() * 200 + 50) + 'px');
});