JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
    <div class="inner">
    </div>
<div>

CSS

div.outer {
    height: 50px;
    width: 600px;
    background-color: blue;
}

div.inner {
    height: 50px;
    width: 500px;
    background-color: red;
}

div.outer.myanimatedclass {
    width: 300px;
}
div.outer.myanimatedclass div.inner {
    width: 100px;
}

JavaScript

$('div.outer').addClass('myanimatedclass', {
    children: true,
    duration: 1000
});