For loop javascript not assigning correct value

Question

I'm creating a loop which finds all elements in a class that contain the character 'L' and performing an innerHTML command to each. This loop seems to work fine until I get to actually do i.innerHTML = '', where the i's is the array for L strings. Why can't I do it like this? If I do a console.log(i); inside the if statement I get the correct array.

letts = document.getElementsByClassName('span2');
for(i in letts){
        if(i.indexOf('L') !== -1){
                i.innerHTML = '';
        }
}

VisioN · Accepted Answer · 2013-04-16 15:25:57Z

3

You do it wrong.

i in for .. in loop refers to object property name. It is better to iterate NodeList collections (as arrays) with simple for loop as described in below.

var letts = document.getElementsByClassName("span2");
for (var i = 0, len = letts.length; i < len; i++) {
    if (letts[i].innerHTML.indexOf("L") > -1) {
        letts[i].innerHTML = "";
    }
}

answered Apr 16, 2013 at 15:25

VisioN

146k35 gold badges287 silver badges291 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

PSL · Accepted Answer · 2013-04-16 15:29:01Z

1

your i in for-- in loop refers to the index (0 based). You should use

for(i in letts){
        if(letts[i].indexOf('L') !== -1){
   ...

or

for (var i = 0, i < letts.length; i++) {
...

answered Apr 16, 2013 at 15:29

PSL

124k21 gold badges257 silver badges243 bronze badges

Comments

Kos · Accepted Answer · 2013-04-16 15:32:25Z

0

A foreach loop is handy in such situations.

Arrays have a forEach method, but NodeLists don't, for some reason. You could use one of:

.forEach function of underscore.js
.each function of JQuery (or pretty much any framework)
or the [].forEach.call() trick.

answered Apr 16, 2013 at 15:32

Kos

72.7k28 gold badges174 silver badges239 bronze badges

Collectives™ on Stack Overflow

For loop javascript not assigning correct value

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related