Changing the label color of radio button onclick in this custom css
<p>I have attached plunker link in this.</p>

<p>Can anyone please tell me how can i edit this so that i can change the label color onclick of radio button .</p>

<p><a href="https://plnkr.co/edit/oajIUWAv2cQy3BrFhlhB?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/oajIUWAv2cQy3BrFhlhB?p=preview</a></p>

<pre><code>&lt;html&gt;

  &lt;head&gt;
    &lt;link rel="stylesheet" href="style.css"&gt;
    &lt;script src="script.js"&gt;&lt;/script&gt;
  &lt;/head&gt;

  &lt;body&gt;
    &lt;div class="radio-item"&gt;
    &lt;input type="radio" id="ritema" name="ritem" value="ropt1"&gt;
    &lt;label for="ritema"&gt;Option 1&lt;/label&gt;
&lt;/div&gt;

&lt;div class="radio-item"&gt;
    &lt;input type="radio" id="ritemb" name="ritem" value="ropt2"&gt;
    &lt;label for="ritemb"&gt;Option 2&lt;/label&gt;
&lt;/div&gt;
  &lt;/body&gt;

&lt;/html&gt;
</code></pre>

<p>CSS</p>

<pre><code>.radio-item {
  display: inline-block;
  position: relative;
  padding: 0 6px;
  margin: 10px 0 0;
}

.radio-item input[type='radio'] {
  display: none;
}

.radio-item label {
  color: #666;
  font-weight: normal;
}

.radio-item label:before {
  content: " ";
  display: inline-block;
  position: relative;
  top: 5px;
  margin: 0 5px 0 0;
  width: 20px;
  height: 20px;
  border-radius: 11px;
  border: 2px solid #004c97;
  background-color: transparent;
}

.radio-item input[type=radio]:checked + label:after {
  border-radius: 11px;
  width: 16px;
  height: 16px;
  position: absolute;
  top: 9px;
  left: 10px;
  content: " ";
  display: block;
  background: #004c97;
}
</code></pre>