JSFiddle - React, Tailwind, and code Playground

HTML

<div class="profileInfo" id="About" style="border:solid;" contenteditable="true">OOOOO</div>
                    <div id="counter"></div>

JavaScript

jQuery(document).ready(function($){
    
        const limit = 10;
        rem = limit - $('#About').text().length;
        $("#counter").append("You have <strong>" + rem + "</strong> chars left.");
        $("#About").on('input', function(event) {
            var char = $('#About').text().length;
            rem = limit - char;
            $("#counter").html("You have <strong>" + rem + "</strong> chars left.");
            if(char>limit)
            {
                event.preventDefault();
                //TODO
            }

        });

    });