Al hacer clic en el botón, necesito eliminar la siguiente configuración de css de #tg :
.wrap div{ text-align:justify; text-align-last:left; } y agregue una clase acenter , es decir, alinee el centro
#tgx .no debe cambiarse
Puedo hacerlo por $('#tg').css(...) pero agrega un estilo en línea que quiero evitar
$('button').on('click', function(){ $('#tg').addClass('acenter'); }); .wrap div{ text-align:justify; text-align-last:left; } .acenter{ text-align:center; text-align-last:center; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class='wrap'> <div class='tg' id='tg'>lorem ipsum</div> <div class='tgx' id='tgx'>dolor sit</div> </div> <button>CLICK</button>Puede agregar para ellos una clase. Por ejemplo, agrego para ellos la clase oldClass . Luego puedo eliminarlo con $('#tg').removeClass('oldClass'); .
$('button').on('click', function() { $('#tg').addClass('acenter'); }); .wrap div { text-align: justify; text-align-last: left; } .acenter { text-align: center !important; text-align-last: center !important; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class='wrap'> <div class='tg' id='tg'>lorem ipsum</div> <div class='tgx' id='tgx'>dolor sit</div> </div> <button>CLICK</button> Actualización: actualicé otra solución usando !important para sobrescribir CSS porque el autor no puede agregar la estructura HTML.