JSFiddle - React, Tailwind, and code Playground

by Afzaal Ahmad Zeeshan

HTML

<div class='default'>Love for all, Hatred for none.</div>
<div class='err'>Love for all, Hatred for none.</div>
<div class='high'>Love for all, Hatred for none.</div>
<div class='act'>Love for all, Hatred for none.</div>
<div class='ui-default-state'></div>
<div class='ui-active-state'></div>
<div class='ui-state-error'></div>
<div class='ui-state-highlight'></div>

CSS

.ui-default-state {
    background-color: red;
}

.ui-active-state {
    background-color: blue;
}

.ui-state-error {
    background-color: black;
}

.ui-state-highlight {
    background-color: purple;
}

JavaScript

$('.default').css('color', $('.ui-default-state').css('background-color'));

$('.err').css('color', $('.ui-state-error').css('background-color'));

$('.high').css('color', $('.ui-state-highlight').css('background-color'));

$('.act').css('color', $('.ui-active-state').css('background-color'));