Если текст внутри<p>равен X, тогда addClass

Question

Я хочу проверить, что содержание в ближайшем <p> и добавьте класс в div соответственно.

Вот где я застрял.

$('p').each(function () {
    if ($('p').text() == 'E. A. K') {
        $('.pl1').addClass('service');
    }else{
        $('.pl2').addClass('service');
    }
});

.service:after{content:"(service)"}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>E. A. K.</p>
<p>F. F.</p>

<span class=pl1>Player 1</span><br>
<span class=pl2>Player 2</span>

ТАК если первый <p> тогда EAK .pl1 имеет класс service если первый <p> тогда FF .pl2 имеет класс service

Считайте, что есть много <p> все с этими двумя содержаниями. И некоторые новые будут добавляться время от времени.

Answer 1

Сначала вам нужно немного ускорить процесс и убедиться, что вы закрыли скобки в правильных местах.

Ты говоришь the <p> that appears closest to the top of the body, тогда вы хотите только 1, поэтому нет необходимости перебирать каждый <p>

Это должно делать то, что вы хотите, но все еще не уверены, поскольку ваша логика странная, в любом случае надеюсь, что это поможет.

$('body p:first').filter(function() {
  if ($(this).text() == 'E. A. K.') {
    $('.pl1').addClass('service');
  } else {
    $('.pl2').addClass('service');
  }
});

демонстрация

$('body p:first').filter(function() {
  if ($(this).text() == 'E. A. K.') {
    $('.pl1').addClass('service');
  } else {
    $('.pl2').addClass('service');
  }
});

.service:after {
  content: "(service)"
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>E. A. K.</p>
<p>F. F.</p>

<span class=pl1>Player 1</span><br>
<span class=pl2>Player 2</span>

Answer 2

$('p:first').map(function() {
  if ($(this).text() == "E. A. K.") {
    $('.pl1').addClass('service');
  } else {
    $('.pl2').addClass('service');
  }
});

.service {
  color: red;
}

.service:after {
  content: "(service)"
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>E. A. K.</p>
<p>F. F.</p>

<span class="pl1">Player 1</span><br>
<span class="pl2">Player 2</span>