Function breaks and mozillas Javascript console has nothing to say

Hi. I am producing a word cloud however changing the size of the words is proving to be a confusing problem.

basically there is a problem with this ...



for(i=0; i<words.length; i++){

wordCloud = wordCloud + "<span style='font-size:" + freqOfWord(words[i],words) + "em'>" + words[i] + "</span> ";

}



where...

'words' is the name of the array that stores all of the input words.

'wordcloud' is the variable that holds the html for the word cloud.

'freqOfWord(word,arrayName) is a function that loops through the array and returns the number of occurences of that word.


function freqOfWord(word,wordArray){
number = 0;
for(i=0; i<wordArray.length; i++){
if(word==wordArray[i]){
number++;
}
}
alert(number);
return number;
}


Now for some reason the loops breaks after the first run and the value of 'wordCloud' is set to 'Undefined' despite the fact that mozillas javascript console has nothing to say.

Yet if I change the wordCloud line to the following then it loops through fine and the variable wordCloud has all of the correct data in it except for the sizes.


wordCloud = wordCloud + "<span style='font-size:" + 1 + "em'>" + words[i] + "</span> ";


I don't understand why it won't take the size that is being returned by the freqOfWord() function so please any help would be great.

In function freqOfWord you are using the variable i when it is also being used in the words.length loop, try changing the i in freqOfWord to j see if that helps

for(j=0; j<wordArray.length; j++){
if(word==wordArray[j]){

Thanks Mr J. Can't believe I never picked up on that.