why is internet explorer displaying my javascript pagination backwards?

Question

Here's a version of the code I'm using, stripped down to just the parts that aren't working. This is all written to generate some basic pagination with jQuery.

In Chrome/Safari/Moz, I generate see spans, 1,2,3,4,...,etc

When I look in IE7/8, I see etc,...,4,3,2,1

The string seems to be concatenating backwards!!

This seems very strange to me, because there's not a whole lot going on in the code here, I can't figure out which bit could be causing problems.

Obviously, the 1,2,3,4,...,etc is what I'm aiming for here, so as well as an explanation of why this is an issue, I'd love it if someone could offer a quick fix.

myVar = {
arr:$.makeArray($('.my_li'))
};

var str;
str='';

for (s in myVar.arr){
r=parseInt(s,10)+1;
str+='<span class="my_class">'+r+'</span>';
}

$('#my_other_div').html(str);

Answer 1

You might find that it's something to do with the CSS class "my_class" or it's parents, rather than anything to do with the javascript.

Have you tried alert(str) on the respective browsers?

Answer 2

You're using a for...in loop on an Array. Don't do that, it's only for iterating over the properties of an object being used as a mapping.

JavaScript makes no guarantee you'll get the properties back in array order, and you may also get other non-numeric properties of the Array prototype that you don't want.

Instead, use a plain old for (var i= 0; i<array.length; i++) loop. Or, since you're using jQuery, $.each.