CODEWITHSUNDEEP
javascriptloopsfor-loopcallback
Saveh
Saveh

Reputation: 41

javascript doesnt execute code after for

I have created 2 functions in javascript, these functions are fired on click events, the problem is that after the for loops, alerts are not executed. 

function myfunc() {
    for (var i = 0; i < 4; i++) {
        document.getElementsByTagName("h1")[i].style.color="red";
    }

    alert("alert 1"); //this should be executed after the for since it is part of the function code.
}

function myfunc2() {
    for (var j = 0; j < 4; j++) {
        document.getElementsByTagName("h1")[j].style.color="navy";		
    }

    alert("alert 2"); //this should be executed after the for since it is part of the function code
}
<h1 onClick="myfunc()">primo h1</h1>
<h1 onClick="myfunc2();">secondo h1</h1>

Upvotes: 0

Views: 85

Answers (1)

Aleksander Azizi
Aleksander Azizi

Reputation: 9877

You need to check how many h1 tags there are in the DOM before applying new style attributes. You are effectively trying to make changes to undefined. 

var elements = document.getElementsByTagName("h1");

function myfunc() {
    for (var i = 0; i < elements.length; i++) {
        elements[i].style.color="red";
    }

    alert("alert 1"); //this should be executed after the for since it is part of the function code.
}

function myfunc2() {
    for (var j = 0; j < elements.length; j++) {
        elements[j].style.color="navy";
    }

    alert("alert 2"); //this should be executed after the for since it is part of the function code
}
<h1 onClick="myfunc()">primo h1</h1>
<h1 onClick="myfunc2();">secondo h1</h1>

Upvotes: 1

Related Questions