JSFiddle - React, Tailwind, and code Playground

by matake

HTML

<div id="contenedor">
Contenido
</div><br>
<button id="go">go</button>
<button id="go_end">go_end</button>

JavaScript

$('#go').off('click').on('click',function(){
		$('#contenedor').css({
				'-webkit-transition': 'transform 10000ms',
				'-ms-transition': 'transform 10000ms',
				'transition': 'transform 10000ms',
				'transform': 'translate(500px, 0px)'
		});
	});
	$('#go_end').off('click').on('click',function(){
		//copio el contenido del atributo style y quito -webkit-transition: transform 10000ms; con replace
 
        var estilo_nuevo = $('#contenedor').attr('style').replace(/-webkit-transition: transform 10000ms;/,'');
 
        //aquy otra chapuza porque el regex anterior solo me quitaba el -webkit-
        estilo_nuevo = estilo_nuevo.replace(/transition: transform 10000ms;/,'');
 
         //pongo el nuevo estilo .... pero ojo solo funciona si previamente he borrado el contenido del atributo style sobrescribir directamente ej : $('#contenedor').attr('style',estilo_nuevo); No funciona !
        $('#contenedor').attr('style','').attr('style',estilo_nuevo);
		
	});