why do dispatchEvent(evt) does not work on google chrome, safari, opera

[Snoopy_me]

Hello
I have a dropddown menu where the main menu items when on click should display a subnav tht has other sublinks.
When i clicked on main menu item it is supossed to go on a link , the problem is tht my dropdown menu is not working on the following browser google chrome, safari, opera. It is working perfectly on ie6,ie7 and firefox.Any help would be highly appreciatee.:)

Here is my html code


<div class="menu_wrapper">

<div id="mainmenu">


<a href="http://testapp.resh.dream.com/index/index"" id="MainNav_0" >Home</a>
<div class='nav_seperator'></div>
<a href="http://testapp.resh.dream.com/campaign/index" id="MainNav_1">Campaign</a>
<ul class='SubItems' id="SubmenuNav_1" >
<li>
<a href="http://testapp.resh.dream.com/campaign/index" ><img src="images/NewMenu/Dashboard_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/campaign/index'>DASHBOARD</a></p>
</li>
<li>
<a href="http://testapp.resh.dream.com/target/index" ><img src="images/NewMenu/Target_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/target/index'>TARGET</a></p>
</li>
<li>
<a href="http://testapp.resh.dream.com/creation/index" ><img src="images/NewMenu/Creation_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/creation/index'>CREATION</a></p>
</li>
<li>
<a href="http://testapp.resh.dream.com/plan/index" ><img src="images/NewMenu/Plan_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/plan/index'>PLAN</a></p>
</li>
</ul>
<div class='nav_seperator'></div>
<a href="http://testapp.resh.dream.com/report/index" id="MainNav_2">Report</a>
<ul class='SubItems' id="SubmenuNav_2">
<li>
<a href="http://testapp.resh.dream.com/report/index"><img src="images/NewMenu/Dashboard_off.png" width='64' height='53'/></a>
<p><a href="#">DASHBOARD</a></p>
</li>
<li><a href="http://testapp.resh.dream.com/database/index" ><img src="images/NewMenu/Reports_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/database/index'>DATABASE</a></p>
</li>
<li>
<a href="http://testapp.resh.dream.com/campaign/index"><img src="images/NewMenu/Plan_off.png" width='64' height='53'/></a><p>
<a href='http://testapp.resh.dream.com/campaign/index'>CAMPAIGN</a></p>
</li>
<li>
<a href="http://testapp.resh.dream.com/business/index" ><img src="images/NewMenu/Budget_off.png" width='64' height='53'/></a>
<p><a href='http://testapp.resh.dream.com/business/index'>BUSINESS</a></p>
</li></ul>
</div>



</div>


here is my javascript


function fireEventSport(element,event){
if (document.createEventObject){
// dispatch for IE
var evt = document.createEventObject();
return element.fireEvent('on'+event,evt)
}
else{
// dispatch for firefox + others
var evt = document.createEvent("HTMLEvents");
evt.initEvent(event, true, true ); // event type,bubbling,cancelable
return !element.dispatchEvent(evt);
}
}
$(function(event)
{
var $url = window.location.href;
var $arrAnchor = document.getElementsByTagName('a');
var $id;

for(i=0,count=$arrAnchor.length;i<count;i++)
{

if($url.indexOf($arrAnchor[i].href)>-1)
{
$id = $arrAnchor[i].id;

break;

}
}

fireEventSport(document.getElementById($id),'click');


});



thank you for ur help

[davisoski]

Hi.

I'm experience the same problem. Its very important for me to fix this stuff.

I'm using the code in:
http://stackoverflow.com/questions/3918399/simulate-onclick-event-problems-in-chrome

this guy say is works perfect, but no way.

I see this post is old, did you finally resolve this stuff?.

If so, could you please help me??

thanks