cannot input data using innerHTML

Question

This code displays all numbers in the array on the left, odd numbers in the middle and the even ones on the right, but the div center does not accept the values. checked over it and debugged for about half an hour and nothing. The code used to input the data for left and right is the same but for center it does not work. when checking through the console center has the values stored just like left and right but it was not able to insert the stored values into the div. Any help would be greatly appreciated.

<style>
        #left{
            width : 30%;
            float: left;
        }
        #right{
            width: 30%;
            float: left;
        }
        #center{
            width: 30%;
            float: left;
        }
    </style>
</head>
<body>

    <div id = "left"></div>
    <div id = "right"></div>
    <div id = "center"></div>

    <script>
    var mya = new Array(50);

    var l = document.getElementById("left");
    var r = document.getElementById("right");
    var c = document.getElementById("center");

    var left = '';
    var right = '';
    var center = '';

    for(var c = 0;c<mya.length;c++){
        mya[c] = parseInt(Math.random() * 100);
        left+="<li>" + mya[c] +"</li>";
        if (mya[c]%2){right+="<li>" + mya[c] +"</li>";}
        else{center+="<li>" + mya[c] +"</li>";}
    }

    l.innerHTML+="<ul>" + left + "</ul>";
    r.innerHTML+="<ul>" + right + "</ul>";  
    c.innerHTML+="<ul>" + center + "</ul>";

    </script>
</body>

This typo just in the question, c.inerHTML+="<ul>" + center + "</ul>";? — j08691
– j08691, Commented Feb 12, 2014 at 3:25

j08691 · Accepted Answer · 2014-02-12 03:28:38Z

4

(in addition to the typo I noted in the comments above) You're overwriting c in your loop and that's causing the issue. Change:

var c = document.getElementById("center");
// and
c.inerHTML

to

var ctr = document.getElementById("center");
// and
ctr.innerHTML

jsFiddle example

answered Feb 12, 2014 at 3:28

j08691

208k33 gold badges269 silver badges281 bronze badges

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

3 Comments

leigero Over a year ago

While you're totally correct, I think it would be a better idea to change the var c inside the loop and leave the rest in the same format as it was. The loop variable doesn't need to be a c and its confusing and misleading.

j08691 Over a year ago

@leigero - that's fine, but the bottom line is that the duplication of variable names is what's causing the issue.

Vidura Over a year ago

Thank you, its always the simplest things i seem to miss.

Collectives™ on Stack Overflow

cannot input data using innerHTML

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related