Why JS function name conflicts with element ID?

Question

I\'ve got two almost identical simple JS fiddles calling a function on select change. Function name is the same as select ID in both cases, but for some reason the first fid

Answer 1

IE automatically reserves a var ID = domElement; in the global space for each DOM-Element with an ID. Some other browsers adopted this behaviour.

Always try to avoid using same IDs and varnames! Alternatively, use your own namespace in JS to avoid the collisions.

EDIT:

I don't know why one of your examples fails, while the other one works. It might be a simple timing/order of execution -issue caused by the wrapping

.