JSFiddle - React, Tailwind, and code Playground

HTML

<div id="texttoggle">
    <span id="increase">+</span>
    <span id="decrease">-</span>    
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

<div class="messageContent">
    <blockquote class="messageText ugc baseHtml">
        fdsafdsfdsafdsafdsa
    </blockquote>
</div>

CSS

.messageContent
{
    padding: 10px 0px;
    margin: 10px 0;
    border: 1px solid grey;
}
#texttoggle
{
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;

    position: fixed;
    padding: 3px;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(0, 0, 0, 0.45);
    color: #FFFFFF;
}

#increase,
#decrease
{
    vertical-align: top;
    cursor: pointer;
}

#increase
{
    font-size: 40px;
}
#decrease
{
    font-size: 32px;
}

JavaScript

$(function() {
    $('#increase').click(function() {
        $('blockquote').animate({ fontSize: '+=1px' }, 'fast');
    });
    $('#decrease').click(function() {
        $('blockquote').animate({ fontSize: '-=1px' }, 'fast');
    });
});