选中复选框后更改标签颜色

Question

如何在检查输入时更改标签的字体颜色？

JSFIDDLE

这是我的代码：

<div>
  <input type="checkbox" id="check" class="check-with-label" />
  <span>icon here</span>
  <label for="check" class="label-for-check">My Label</label>
<div>

.check-with-label:checked + .label-for-check {
  color: blue;
}

我尝试了以下解决方案，但标签和跨度都将获得该字体颜色：

<div>
  <input type="checkbox" id="check" class="check-with-label" />
  <label for="check" class="label-for-check"><span>icon here</span> My Label</label>
<div>