Javascript / jQuery change inline style values
<p>I have an inline css in my page:</p>

<pre><code>&lt;style id="abc"&gt;
 .player-holder{
    position:relative;
    width:100%;
    height:40px;
 }
 .icon-color{
    color:#fff;
   -webkit-transition: color 0.3s ease-in-out;
   transition: color 0.3s ease-in-out; 
 }
 .icon-rollover-color{
   color:#fff;
   -webkit-transition: color 0.3s ease-in-out;
   transition: color 0.3s ease-in-out; 
 }
&lt;/style&gt;
</code></pre>

<p>Is it possible to change some values on the fly (using jquery/javascript) so that browser takes change immediately?</p>

<p>Like change:</p>

<blockquote>
  <p>.icon-rollover-color </p>
</blockquote>

<p>to</p>

<blockquote>
  <p>color:#333;</p>
</blockquote>