JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    Lorem ipsum dolor sit amet
</div>

CSS

.box {
    color: black;
}

.box.break-one {
    color: red;
}

.box.break-two {
    color: blue;
}

.box.break-three {
    color: yellow;
}

JavaScript

$(document).ready(function() {
    box_size();
    
    $(window).resize(function() {
        box_size();
    });
    
    function box_size() {
        var window_width = $(window).width();
        
        $('.box').removeClass('break-one').removeClass('break-two').removeClass('break-three');
        
        if (window_width <= 1000 && window_width > 900) {
            $('.box').addClass('break-one');
        }
        else if (window_width <= 900 && window_width > 800) {
            $('.box').addClass('break-two');
        }
        else if (window_width <= 800) {
            $('.box').addClass('break-three');
        }
    }
});