toggle href onmousover onmouseout

Dear list,

I have a very simple problem. I just would like to toggle the href attribute on a use element with onmouseover and onmouseout events. It works in Firefox. But It does not work in Chrome and IE9 ?

Thank you for your help

Please find below the code

<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" viewBox="0 0 400 250">
<script type="text/ecmascript">
 <![CDATA[
  var xlinkNS = "http://www.w3.org/1999/xlink";
	function rec1(evt) {
	var element = evt.currentTarget;
	element.setAttributeNS(xlinkNS,"href","#symbolRect1");
         }

	function rec2(evt) {
	var element = evt.currentTarget;
	element.setAttributeNS(xlinkNS,"href","#symbolRect2");
         }
    ]]>
    </script>

<defs>
 <symbol id="symbolRect1">
 <rect  width="50" height="30" fill="yellow"/>
 </symbol>
 <symbol id="symbolRect2">
  <rect  width="50" height="30" fill="red"/>
  </symbol>
</defs>
<use  x="20" y="100" xlink:href="#symbolRect1" onmouseover="rec2(evt);" onmouseout="rec1(evt);"/>
</svg>



------------------------------------

-----
To unsubscribe send a message to: [email protected]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/svg-developers/

<*> Your email settings:
    Individual Email | Traditional

<*> To change settings online go to:
    http://groups.yahoo.com/group/svg-developers/join
    (Yahoo! ID required)

<*> To change settings via email:
    [email protected] 
    [email protected]

<*> To unsubscribe from this group, send an email to:
    [email protected]

<*> Your use of Yahoo! Groups is subject to:
    http://docs.yahoo.com/info/terms/