Javascript 获取文本并插入css样式

下午好。请有人能帮我用jquery完成这项工作。 我想将其转换为：

<li class="li-class">
    <input class="class-radio" name="radio_1" value="red_0" id="id-radio" tabindex="1" type="radio">
    <label for="id-radio"></label>
<label for="id-radio"><span class="span-color">red</span></label>
</li>
<li class="li-class">
    <input class="class-radio" name="radio_1" value="blue_0" id="id-radio" tabindex="2" type="radio">
    <label for="id-radio"></label>
<label for="id-radio"><span class="span-color">blue</span></label>
</li>

红色


蓝色

在这方面：

<li class="li-class">
    <input class="class-radio" name="radio_1" value="red_0" id="id-radio" tabindex="1" type="radio">
    <label for="id-radio"></label>
<label for="id-radio"><span class="span-color" style="color:red">red</span></label>
</li>
<li class="li-class">
    <input class="class-radio" name="radio_1" value="blue_0" id="id-radio" tabindex="2" type="radio">
    <label for="id-radio"></label>
<label for="id-radio"><span class="span-color" style="color:blue">blue</span></label>
</li>

红色


蓝色

如果你看，我想让标签之间的文字被添加为样式中的颜色值

这里有一张图片可以更好地解释

---

感谢大家的友好帮助

如果您打算在单击时更改样式，以下是我的代码片段（ID必须是唯一的，因此我重新排列了它们）：

$（函数（）{
$（'：radio[name=“radio_1”]'）。在（'change'，函数（e）上{
$（this）.closest（'.li class'）.find（'.span color'）.attr（'style'，function（index，attr）{
返回'color:'+this.textContent；
});
$（this）.closest（'.li class'）.sides（）.find（'.span color'）.removeAttr（'style'）；
})
});


红色


蓝色
按照我所附的片段进行操作


window.onload=function（）{
var span=document.getElementsByTagName（“span”）；
var colors=[].slice.call（span.map）（e=>e.innerHTML）；
对于（var i=0；i什么使您认为jquery是正确的工具？是否要切换基于单选按钮检查状态的颜色插入？您尝试了什么？jquery有一个方便的
.prop（）
函数，用于添加/编辑元素的属性。@David我更喜欢使用
.css（）
函数，因为它是CSS属性。非常感谢，我希望单选按钮标签中有彩色圆圈，但wordpress不允许我将类放在span标记中。谢谢，如果您的代码按照我的意愿工作，但在应用于wordpress时不工作，我觉得单选按钮输入是also用jquery生成我不认为在wordpress上运行它是一个困难的问题，如果你愿意，我可以帮助你。只是没有得到最后一个。它们生成的机制是什么？点击按钮还是什么？我