Get first row with jQuery on a specific HTML tag

This is my HTML:

<p class="myclass">

<span class="generalclass">text1</span>
<span>text2</span>
<span>text3</span>
</p>

<p class="myclass">

<span class="generalclass">text1</span>
<span>text2</span>
<span>text3</span>
</p>

and each of the other 3 <p> tags are identical.

This my jQuery Code:

var promo = $('[class^="myclass"]').map(function() {
    return $(this).text();
    //I try something like return $(this).children.text(':first') but NOT Work
}).get();
let promo1 = promo[0];
let promo2 = promo[1];
let promo3 = promo[2];

Results: promo1 = text1 text2 text3

How can I get the text from only <span> / ROW 1 and not the other span tag content?

tks

Upvotes: 0

Views: 36

Answers (2)

Mike Irving
Mike Irving

Reputation: 1630

try this code to get the value from the first <span>

var promo = $('[class^="myclass"]').map(function() {
    return $(this).find("span:first-of-type").text();
}).get();

Upvotes: 0

Ivan Ambla
Ivan Ambla

Reputation: 743

var promo = $('[class^="myclass"]').map(function() {
    return $(this).children(":first").html();
}).get();
let promo1 = promo[0];
let promo2 = promo[1];
let promo3 = promo[2];

Upvotes: 0

Related Questions