linkIdOn
's scope is limited to cambioColorOnMouseover
. But that is not your only problem. You need to move several things around.
My suggestion:
for(var linkId = 1; linkId < 5; linkId++) {
document.getElementById('link'+linkId).onmouseover = function() {
this.style.backgroundColor = "#eee";
console.log(this.id);
};
document.getElementById('link'+linkId).onmouseout = function() {
this.style.backgroundColor = "#ccc";
console.log(this.id);
};
}
For the benefit of others who don't know the CSS3 way to do this (which, though the OP wants to do this in JavaScript, is the preferred way):
#link1, #link2, #link3, #link4, #link5 {
background-color: #ccc;
}
#link1:hover, #link2:hover, #link3:hover, #link4:hover, #link5:hover {
background-color: #eee;
}
Though if you did the CSS, you would likely have a link
class instead of using ids.
(I´ve changed two small typos that prevented the example to work (the system tells me that edits must be at least 6 characters) Thanks for your help! - Rosamunda)