JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" name="status" class="status" value="Pendente" readonly />
<input type="text" name="status" class="status" value="Pendente" readonly />
<input type="text" name="status" class="status" value="Pendente" readonly />
<input type="text" name="status" class="status" value="Pendente" readonly />
<input type="text" name="status" class="status" value="Resolvido" readonly />
<input type="text" name="status" class="status" value="Pendente" readonly />
<input type="text" name="status" class="status" value="Resolvido" readonly />
<input type="text" name="status" value="Sem class status" readonly />

CSS

.status{
    display:block;
    text-align:center;
}
.pendente {
    background-color:red;
    color:white;
}
.resolvido{
    background-color:green;
    color:white;
}

JavaScript

$(document).ready(function(){
    $("input[value='Resolvido'].status").addClass('resolvido');
    $("input[value='Pendente'].status").addClass('pendente');
});