JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <p class="par1">text1: 15px at start.</p>
    <p class="par2">text2: 17px at start.</p>
</div>

<button>Doble sized me!</button>

<div>
    <p class="par3">Elements outside the container, are not affected</p>
</div>

CSS

.container {
    font-size: 10px;
}

.par1 {
    font-size: 1.5em;
}

.par2 {
    font-size: 1.7em;
}

.par3 {
    font-size: .8em;
}

JavaScript

$('button').on('click', function(e){
    var standardSize = parseInt($('.container').css('font-size'));
    $('.container').css('font-size', (2*standardSize)+'px');
});