JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="txt" rows="6" cols="40" onkeyup="u();"></textarea>

<div id="output"></div>

CSS

.red {color: red;}
.green {color: green;}

JavaScript

function u() {
    
    var s = document.getElementById("txt").value.toLowerCase();
    var a = "abcdefghijklmnopqrstuvwxyz", max=0, o="", need="";
    for (var i = 0; i < a.length; i++) {
        var c = a[i];
        var n = (s.match(new RegExp(c, "g")) || []).length;
        if (n > max) max=n;
    }
    for (var i = 0; i < a.length; i++) {
        var c = a[i];
        var n = (s.match(new RegExp(c, "g")) || []).length;
        if (n > 0) {
            o += "<div class='";
            o += (n == max?"green":"red");
            o += "'> "+ c +" : "+ n+"</div>";
        }
        if (n > 0) {
            while (n < max) {
                need += " "+c;
                n++;
            }
        }
    }
    o += "<br>Length : "+s.length;
    document.getElementById("output").innerHTML = o + "<br><br>Need: "+need;
}