html - JavaScript AddEventListener not working -

so i'm trying make slideshow user can click next browse through pictures. i've created array images:

var staff = new array(); staff[0] = "/images/isabelle.png"; staff[1] = "/images/nook.png"; staff[2] = "/images/timothy_tommy.png"; staff[3] = "/images/mabel.png"; staff[4] = "/images/sable.png"; staff[5] = "/images/labelle.png"; 

and function changing images:

var = 1; function nextimage(){     document.getelementbyid("slide").src = staff[i];     if(i < staff.length)         i++;     else = 0; //wraps around first image } 

the addeventlistener function call added registerhandlers function initialize onload:

document.getelementbyid("next").addeventlistener("click",nextimage,false); 

and image , "next" button placed in divs inside body:

<div class="container">     <img id ="slide" src="images/isabelle.png" /> </div> <div id="next">     <button type="button">next</button> </div> 

i've tried looking solutions , example code can't seem make work

try adding event handler dhtml, don't have wait load elements, in case that's issue:

<button type="button" onclick="nextimage();">next</button>