Add custom event listener to button

[Diggo11]

I'm trying to inject javascript onto the forum home page that will allow me to run a custom function when the button is pressed collapse/uncollapse a forum category: (https://www.vbulletin.com/forum/images/buttons/collapse_40b_collapsed.png)
$template_hook['headinclude_bottom_css'] .= '<script type="text/javascript">' . "\n";

$template_hook['headinclude_bottom_css'] .= "function toggleCollapsedPlugin(sender, collapseState) {
/* Do something */
}

function initCollapsedPlugin() {
var forumcats = document.getElementById('forums').getElementsByTag Name('li');
var callCollapsedPlugin;
for (var i = 0; i < forumcats.length; i++) {
if (forumcats[i].className.indexOf('forumbit') >= 0 && forumcats[i].className.indexOf('L1') >= 0) {
var button = forumcats[i].getElementsByTagName('a')[1].getElementsByTagName('img')[0];
if (button.src.indexOf('_collapsed') >= 0) {
toggleCollapsedPlugin(button, true);
}
callCollapsedPlugin = function(){ toggleCollapsedPlugin(button); };
button.addEventListener('click', callCollapsedPlugin, false);
}
}
}";

$template_hook['headinclude_bottom_css'] .= '</script>' . "\n";

When I pause script execution using Chrome DevTools, I can step through the javascript and see the event listener supposedly being added. However, when I then click on any of the elements that were assigned to the button variable, the function toggleCollapsedPlugin is never called. Any ideas why?

--------------- Added 1342101636 at 1342101636 ---------------

http://stackoverflow.com/questions/11453105/javascript-eventhandler-always-being-added-to-last-object-in-array