使用jQuery替换标签中的文本

Question

这可能是一个很简单的问题，但我对jQuery不是很有经验。我试着谷歌这个问题，但我似乎找不到一个替代的功能，或者也许我做错了这一个。

因此，当我加载页面时，HTML基本上如下所示：

<div class="control control-department">
    <label><input type="radio" name="department" value="residential-sales">Residential Sales</label>
    <label><input type="radio" name="department" value="residential-lettings"> Residential Lettings</label>
</div>

然后我使用一些jQuery来替换按钮的文本，例如用以下代码替换住宅销售和购买：

$( document ).ready(function() {
    $('.control-department label:nth-child(1)').text('BUY');
    $('.control-department label:nth-child(2)').text('RENT');
});

但是，一旦jQuery运行，它就会给出以下HTML并删除。有什么想法，我可以让它只是取代“住宅销售”和“住宅出租”部分，而不是整个事情？

<div class="control control-department">
    <label>BUY</label>
    <label>RENT</label>
</div>

谢谢大家！

Answer 1

你可以这样试试：

null

$(document).ready(function() {
//loop through label
  $(".control-department label").each(function(i) {
    var child = $(this).children();//save children
    i % 2 == 0 ? $(this).text('BUY') : $(this).text('RENT')//change text
    $(this).prepend(child)//prepend children again
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="control control-department">
  <label><input type="radio" name="department" value="residential-sales">Residential Sales</label>
  <label><input type="radio" name="department" value="residential-lettings"> Residential Lettings</label>
</div>