I have some html snippet
<p>
<span >1</span><span> x </span><bdi><span >CA$</span><span id="sec_price_4082395074_1161" >89</span></bdi>
</p>
The first instance of .et-cart-product-price
shows the currency symbol and the second shows the price.
To get the currency symbol i am using jquery like this
var currency_currency_symbol = $("span.et-cart-product-price").text();
How can i select the text in the first and second occurrence of the et-cart-product-price
class respectively?.
CodePudding user response:
Your selector finds multiple elements.
By calling text()
on the array, the values are merged.
Since you want both values in a seperate variable, you'll need to alter the selector, and use (eg) map()
to convert the DOM element to the value you need. I've use a list syntax to assign the array values to 2 variables:
var currency_currency_spans = Array.from($("span.et-cart-product-price"));
var [ symbol, price ] = currency_currency_spans.map(e => e.innerHTML);
console.log('Symbol:', symbol);
console.log('Price:', price);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
<span >1</span>
<span> x </span>
<bdi>
<span >CA$</span>
<span id="sec_price_4082395074_1161" >89</span> </bdi>
</p>