Reputation: 43
Adding all elements with child class name to one array. But it adds them to three separate arrays. Why?
document.querySelectorAll('.child').forEach(function(el) {
var arr = []
arr.push(Number(el.textContent))
var largest = Math.max(arr);
console.log(arr)
})
<div id=“container”>
<ul>
<li>5</li>
<li>10</li>
<li>15</li>
<li class="child">20</li>
<li>25</li>
<li>30</li>
</ul>
<div class="child">
<p>99</p>
</div>
<div class="child">
<p>63</p>
</div>
<div id="bNg8Rb">
</div>
<div id="CAIQAA"></div>
<div id="LC20lb"></div>
</div>
Upvotes: 2
Views: 721
Reputation: 1791
Your problem is you are defining a new array everytime your program goes through your foreach loop. define it before the foreach loop and that will solve your problem.
var arr = [];
document.querySelectorAll('.child').forEach(function(el) {
arr.push(Number(el.textContent))
})
var largest = Math.max(...arr);
console.log(arr);
console.log(largest);
<div id=“container”>
<ul>
<li>5</li>
<li>10</li>
<li>15</li>
<li class="child">20</li>
<li>25</li>
<li>30</li>
</ul>
<div class="child">
<p>99</p>
</div>
<div class="child">
<p>63</p>
</div>
<div id="bNg8Rb">
</div>
<div id="CAIQAA"></div>
<div id="LC20lb"></div>
</div>
Upvotes: 4