Si lo que quieres es quedarte sólo con los span
que están dentro de otro span
en el div con clase .row
, te recomendaría que usases un selector diferente de getElementsByTagName
. Por ejemplo, sería más conveniente usar querySelectorAll
querySelectorAll
.
A esa función le pasas un selector como los de CSS y te devolverá todos los elementos que cumplen esa condición. Así por ejemplo, con el selector .row > span > span
lo que vas a obtener son todos los elementos span
que son hijos directos de otro span
y que estén dentro de .row
. Aquí lo puedes ver funcionando:
function myFunction6() {
var foo = document.querySelectorAll('.row > span > span');
for (var i = 0; i < foo.length; i++) {
console.log(foo[i].tagName + " " + foo[i].textContent);
}
}
myFunction6()
<div class="row">
<span class="red">66
<span>22 </span>
</span>
<span class="green">24
<span class="blue" style="color: #000;">82 </span>
</span>
<span class="green">10
<span class="blue" style="color: #000;">1 </span>
</span>
<span class="red">69
<span>80 </span>
</span>
<span class="red">12
<span class="green" style="color: #000;">11 </span>
</span>
</div>