select a tag and change its text using jquery

Question

My DOM structure is like below.

<div class="selectricWrapper">
  <div class="selectricHideSelect">
    <select name="ageGroup" id="ageGroup">
       <option value="-1">Any</option>
       <option value="0 To 1">0 To 1</option>
       <option value="1 To 2">1 To 2</option>
       <option value="2 To 3">2 To 3</option>
    </select>
  </div>
  <div class="selectric">
    <p class="label">Any</p>
    <b class="button">▾</b>
  </div>
</div>

I can select class "selectric" from selector

$("#ageGroup").parent().next()

but how to select (selector) & change text of its child <p> tag, i don't want to change/rewrite .button div

any help would be appreciated, thanks in advance

Answer 1

$("#ageGroup").parent().next().children("p").text("New text");

Answer 2

I think what you're looking for is the .text() method:

$('.selectric p.label').text('new text here');

or:

$('.selectric p:first-child').text('new text here');

http://api.jquery.com/text/

Answer 3

在下面的这种情况下，我们将从顶部DIV转到所需的DOM对象。

$('.selectricWrapper .selectric p.label').text('Place you text');

Answer 4

要仅更改标签文本，您需要执行以下操作：

$("#ageGroup").parent().next().children("p.label").text("New text");