javascript: loop through elements and change their values

Question

My code doesn't change element values I'm working in Visual Studio 2017 with cordova inAppBrowser and I'm not sure why it doesn't work? My code:

var elements = document.getElementsByTagName('div');

for (var i = 0; i < elements.length; i++) { 
  elements[i].innerHTMl = "sometext";
}

I want my code to change each element. I appreciate your help

It works fine now with divs, but I used the same thing but with forms and elements[i].onSubmit = 'function(){ alert(string) }'; and it doesn't work on submiting a form, I also checked code with alert and it stays unchanged the whole time. If you have any idea why it doesn't work I would be soo thankful to you — Djordje Vujicic, Jul 10 '17 at 17:48
I've found out the soulution for my problem. onsubmit didn't work for me so I used elements[i].action = 'javascript:myFunction();'; to do javascript action instead of redirecting page. Thanks everyone! — Djordje Vujicic, Jul 10 '17 at 18:52

score 1 · Answer 1 · answered Jul 10 '17 at 17:30

1

Typo:

elements[i].innerHTMl should read elements[i].innerHTML (uppercase L)

answered Jul 10 '17 at 17:30

grateful

1,128
13
25

Nicolas · Accepted Answer · 2017-07-10T17:52:14.767

1

You have a typo in your code, it's innerHTML not innerHTMl here is a working fiddle https://jsfiddle.net/j8nbdm6b/2/

edited Jul 10 '17 at 17:52

answered Jul 10 '17 at 17:30

Nicolas

8,077
4
21
51

Why you put consol.log? Is it necessary? – Djordje Vujicic Jul 10 '17 at 17:36
it is not, you can remove it. – Nicolas Jul 10 '17 at 17:37
Ok thanks, I'll check if it works in my full code and probably mark your answer as the best one – Djordje Vujicic Jul 10 '17 at 17:41
I used the same thing but with forms and elements[i].onSubmit = 'function(){ alert(string) }'; and it doesn't work on submiting a form, I also checked code with alert and it stays unchanged the whole time. If you have any idea why it doesn't work I would be soo thankful to you – Djordje Vujicic Jul 10 '17 at 17:45
Your function is in a String, try passing a real function, I'll edit my fiddle to make it work. – Nicolas Jul 10 '17 at 17:50
Thank you! Try adding a
and
– Djordje Vujicic Jul 10 '17 at 17:54
Well i won't code it for you. play around. See how it work, – Nicolas Jul 10 '17 at 17:54
just one more question, I did it and it sends alert but not on form submit but on loading page, so am I doing it right?
? – Djordje Vujicic Jul 10 '17 at 18:03
are you sure you added the onsubmit on the form, rather than on the parent element, ( `
`) ? – Nicolas Jul 10 '17 at 18:05
I'm sure "elements[i].onSubmit = submitted(); " and elements are all
– Djordje Vujicic Jul 10 '17 at 18:07
try adding it to the action rather than on submit `elements[i].action = myFunc()` – Nicolas Jul 10 '17 at 18:09
I tried it before and it sent me to error page not found... I'll try again, but thanks anyways – Djordje Vujicic Jul 10 '17 at 18:11
You can try to refer to this question for more example https://stackoverflow.com/questions/8082846/form-submit-execute-javascript-best-practice – Nicolas Jul 10 '17 at 18:17
1

I found out that it changes action on elements[i].action = function() {myFunction()}; but it is no good because it sees it as a page URL, but onsubmit stays the same on elements[i].onsubmit = function() {myFunction()}; Anyways I'll try to figure out how to use action for this, probably I'll need javascript: before my code – Djordje Vujicic Jul 10 '17 at 18:27
1

I found out the solution elements[i].action = 'javascript:myFunction();'; should I put solution somewhere in this question? Because I'm new member on stack – Djordje Vujicic Jul 10 '17 at 18:50
i'll just upvote it. – Nicolas Jul 11 '17 at 12:21

score 0 · Answer 3 · answered Jul 10 '17 at 17:36

You have a lowercase L in innerHTML...

Here's a working demo

    (function() {
    document.getElementById('btn').addEventListener('click', function(e) {
      e.preventDefault();
      getDivs();
    })
  })()

  function getDivs() {
    var elements = document.getElementsByTagName('div');
        console.log(elements);
    for (var i = 0; i < elements.length; i++) { 
        elements[i].innerHTML = "sometext" + i;
    }
  }

https://jsfiddle.net/h7cgmxmf/

javascript: loop through elements and change their values

3 Answers3