javascript - child click event firing parent mouseover event -

i have tree structure in mouse on over node name displays (ul) list. each item in list has click event attached it. issue im facing when click on child item in list, fires mouseover event attached parent span. can guys please how solve issue?

<span id="treenodetext"> <ul><li id="firstitem">first item</li></ul> </span> 

my code this: have conman event attach method:

attachevents(domid,eventtype,callbackfunction,otherparams) 

in attachevent function attach events dom ids , assign appropriate call functions

the mouseover event fired before click. so, apart delay, can't prevent handling.

here's 1 way deal :

var timer; document.getelementbyid("treenodetext").addeventlistener('mouseover', function(){     cleartimeout(timer);     timer = settimeout(function(){        // handle mouseover     }, 400); // tune delay (depending on sizes of elements, example) }); document.getelementbyid("firstitem").addeventlistener('click', function(){     cleartimeout(timer); // prevents mouseover event being handled     // handle click };