изменить текст на одном из двух элементов div, используя jquery

Question

как я могу изменить текст (TEXT1) на элементе с помощью a href = "# ajax / test1

   <div class="stats-desc"><a href="#ajax/test1">TEXT1<i class="fas fa-arrow-right"></i></a></div>

    <div class="stats-desc"><a href="#ajax/test2">TEXT2<i class="fas fa-arrow-right"></i></a></div>

у пробовал это

$( document ).ready(function() {

$(".stats-desc").attr('a[href$="#ajax/test1] a').text("NEW TEXT");

});

Answer 1

Вам необходимо включить a[href$="#ajax/test1"] в ваш селектор:

$(document).ready(function() {
  $('.stats-desc a[href$="#ajax/test1"]').text("NEW TEXT");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="stats-desc"><a href="#ajax/test1">TEXT1<i class="fas fa-arrow-right"></i></a></div>

<div class="stats-desc"><a href="#ajax/test2">TEXT2<i class="fas fa-arrow-right"></i></a></div>

Answer 2

Вы можете использовать функцию each для изменения текста как

$(document).ready(function() {
  $('.stats-desc a').each(function(index, item){
    if($(item).attr('href') == "#ajax/test1") $(item).text("NEW TEXT");
  });
});

$(document).ready(function() {
  $('.stats-desc a').each(function(index, item){
    if($(item).attr('href') == "#ajax/test1") $(item).text("NEW TEXT");
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="stats-desc"><a href="#ajax/test1">TEXT1<i class="fas fa-arrow-right"></i></a></div>

<div class="stats-desc"><a href="#ajax/test2">TEXT2<i class="fas fa-arrow-right"></i></a></div>

Answer 3

$(".stats-desc a[href$='#ajax/test1']").text("NEW TEXT");

$( document ).ready(function() {

$('.stats-desc a[href$="#ajax/test1"]').text("NEW TEXT");

})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="stats-desc"><a href="#ajax/test1">TEXT1<i class="fas fa-arrow-right"></i></a></div>

    <div class="stats-desc"><a href="#ajax/test2">TEXT2<i class="fas fa-arrow-right"></i></a></div>