用jquery替換特定的html？

Question

我有一個巨大的不同級別的複選框列表，我想要它的樣式，但因爲所有的項目都有相同的類，沒有id或聯繫表單7 for wordpress沒有選項在複選框面板中使sublevels我想我可以用jQuery實現這一點。

生成的HTML是：

<span class="wpcf7-list-item-label">--- Checkbox level one</span> 
<span class="wpcf7-list-item-label">------ Checkbox level two</span> 

我所試圖實現與

<span class="wpcf7-list-item-label level-one"> 

更換

<span class="wpcf7-list-item-label">--- 

我試着用這個代碼

<script> 
    $("<span class=\"wpcf7-list-item-label\">---").replaceWith("<span class=\"wpcf7-list-item-label level-one\">"); 
    </script> 

但沒有成功，是否有可能用jQuery來實現這一點？

謝謝你的時間。

Answer 1

$('span.wpcf7-list-item-label:first').addClass("level-one") 

如果你想添加一個類基於其索引的所有跨度：

$('span.wpcf7-list-item-label').each(function(index){ 
    $(this).addClass('level-' + index); 
}); 

Answer 2

使用此：

$('.wpcf7-list-item-label').first().addClass('level-one'); 

對於檢查特定的文本，

$(".wpcf7-list-item-label:contains('---')").addClass('level-one'); 

Answer 3

使用這個：

$('.wpcf7-list-item-label').first().removeClass("existingclass").addClass("newclass");