JSFiddle - React, Tailwind, and code Playground

HTML

<button id="test">
Click to get Colors.
</button>

CSS

.class1 {
  width: 20px;
}
.class1, .class2 {
    color: red;
}

JavaScript

function getStyleRuleValue(style, selector, sheet) {
  var sheets = typeof sheet !== 'undefined' ? [sheet] : document.styleSheets;
  for (var i = 0, l = sheets.length; i < l; i++) {
    var sheet = sheets[i];
    if( !sheet.cssRules ) { continue; }
    for (var j = 0, k = sheet.cssRules.length; j < k; j++) {
      var rule = sheet.cssRules[j];
      if (rule.selectorText && rule.selectorText.indexOf(selector) !== -1 && rule.style[style] !== '') {
        return rule.style[style];
      }
    }
  }
  return null;
}

document.getElementById("test").addEventListener("click", function(){
  var color1 = getStyleRuleValue('color', '.class1');
  var color2 = getStyleRuleValue('color', '.class2');
  alert('color1 = ' + color1 + ', color2 = ' + color2); 
});