JSFiddle - React, Tailwind, and code Playground

HTML

<div id="chart"></div>
<ul id="reviews">
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="okay">It's okay</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="excellent">It's excellent</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="okay">It's okay</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="poor">It's poor</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="poor">It's poor</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="good">It's good</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="good">It's good</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="good">It's good</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="good">It's good</div>
    </li>
    <li>
       <p>blah blah blah...</p>
       <div class="user-image"></div>
       <div class="okay">It's okay</div>
    </li>
</ul>

CSS

ul li {
    background-color:#AEAEAE;
    border: solid #000 1px;
    width: 12em;
    margin: 0.25em}    
#chart {
    overflow:auto;}
.bar {
    background-color:red;
    margin:0 auto;}
.result {
    float:left;
    text-align:center;
    margin:0.5em; }

JavaScript

// Add a sum function to the Array
Array.prototype.sum = function(){
    var sum = 0;
    for(var i = 0; i < this.length; sum += this[i++]);
    return sum;
}

$(function() {
    var size = 400;
    var ratings = ["excellent", "good", "okay", "poor"];
    var votes   = [0, 0, 0, 0];
    $("ul li").each(function(){
        ++votes[ $.inArray($("div:last", this).attr("class"), ratings) ];
    });
    var total = votes.sum();
    $(votes).each(function(index, value) {
          // could use something like $("#chart").height() instead of size
        var howTall = (value / total) * size;
        var bar = $("<div>");        
        bar.attr("class", "bar");
        bar.height(howTall);
        bar.width(20);        
        var result = $("<div>");
        result.append(ratings[index]);
        result.attr("class", "result");
        result.append(bar);
        result.append(howTall + "%");
        $("#chart").append(result);        
    })
});