JavaScript
x
32
32
1
<div class="tabs__content tabs__content--bg js-tab-panel">
2
<div class="tabs__panel tabs__panel--active">
3
<div class="product__sizes-wrapper">
4
<ul class="product__sizes-select js-size-select-list" data-locale="UK">
5
<li class="product__sizes-option" data-msg="Sample Message" data-name="6" data-value="060">
6
<span class="product__sizes-size">
7
<span class="product__sizes-size-1">6</span>
8
<span class="product__sizes-size-2"></span>
9
</span>
10
</li>
11
<li class="product__sizes-option" data-msg="Sample Message" data-name="7" data-value="070">
12
<span class="product__sizes-size">
13
<span class="product__sizes-size-1">7</span>
14
<span class="product__sizes-size-2"></span>
15
</span>
16
</li>
17
<li class="product__sizes-option" data-msg="Sample Message" data-name="8" data-value="080">
18
<span class="product__sizes-size">
19
<span class="product__sizes-size-1">8</span>
20
<span class="product__sizes-size-2"></span>
21
</span>
22
</li>
23
<li class="product__sizes-option" data-msg="Sample Message" data-name="9.5" data-value="095">
24
<span class="product__sizes-size">
25
<span class="product__sizes-size-1">9.5</span>
26
<span class="product__sizes-size-2"></span>
27
</span>
28
</li>
29
</ul>
30
</div>
31
</div>
32
I want to extract the values from the product__sizes-size-1
classes and transform them into an array. I have tried to use a .map() function to try and populate an array but it appears empty. To make it clear I want to have the array populated like [6,7,8,9.5] etc…
JavaScript
1
4
1
const sizes = $(".product__sizes-wrapper [data-locale = 'UK']").map(function() {
2
return $(this).text();
3
}).get();
4
Advertisement
Answer
Your approach is correct, you just use the wrong selector. Use product__sizes-size-1
instead:
JavaScript
1
4
1
$(document).ready(function(){
2
var sizes = $('.product__sizes-size-1').map(function(){return $(this).text()}).get();
3
});
4