iteration

[webaster]

Code:
document.getElementById('lemonsNav').className = "makeImgVisible";
document.getElementById('applesNav').className = "makeImgVisible";
document.getElementById('grapesNav').className = "makeImgVisible";
document.getElementById('blueberriesNav').className = "makeImgVisible";

1.

Can you make an iteration so I need not repeat if using same styles over and over again?

2. Is it needed to declare vars too
eg var a = document.getElementById('blueberriesNav');

[RonPK]

The easiest way to perform a repetitive action is to loop through a collection of elements. getElementsByTagName() creates an array of for example all the spans in your document:

var aSpans = document.getElementsByTagName('span'); 
// do the loop 
for (var i = 0; i < aSpans.length; i++) { 
 // perform the action only on specific elements 
 if (aSpans[i].id.indexOf('Nav') > -1) { 
  aSpans[i]].className = 'makeImgVisible'; 
 } 
}

There has to been a pattern in the ID's for this to work, of course.