title: How to dynamically change css selector property value in react js code?
body: <p>I need to dynamically change the color in the react component for specific selector.
  In scss (use sass) i have the following rule:</p>
  
  <pre><code>foo.bar.var * {
    color: blue;
  }
  </code></pre>
  
  <p>I want to change it in react code, to be yellow, red or something else.</p>
  
  <blockquote>
    <p>I cant use <code>style</code> property for element, cause i need the selector to
    apply for all subchilds !=)</p>
  </blockquote>
  
  <p>Is there any native ways? Or should i use Radium? Or is there any similar libs for this? Maybe css-next some hove can help with this?</p>
  
  <p><strong>I have color picker, i cant write class styles for every color</strong> =(</p>
  
  <p>For some answerers NOTE: </p>
  
  <blockquote>
    <p>So i have selector in some scss file, that imported in some root js file  with <code>.class * {color: $somecolor}</code> and i need change the $somecolor in that selector, during picking colors in color picker</p>
  </blockquote>
  
  <p>Maybe i can somehow set selector for all nested inside <code>style</code> property? or there is the way how to recursively apply css style for every nested items from the <code>style</code> prop?</p>