Make a dropdown a multiple select with javascript and select all options in IE

I have two linked drop down select boxes on a home page of one of our 
websites. On loading the page I call a jscript function 
AutoFillYorkshireRegion that tries to make the top select box a 
multiple select, select all options and then call a function that 
takes those selected options calls an ajax function and populates the 
second select box.
However it only works in Firefox. In IE I just end up with the last 
option of the first select box selected. How can I make this work 
cross browser?

function AutoFillYorkshireRegion(){ 
alert('lets auto fill all options') 
document.getElementById('lstYorkshireRegion').multiple = true; 
for(var x=0;x<document.getElementById
('lstYorkshireRegion').options.length;x++){
document.getElementById('lstYorkshireRegion').options
[x].selected=true; 
}
selYorkshireRegion();
document.getElementById('lstYorkshireRegion').multiple = false; 
}

function selYorkshireRegion(){ 
if(bAllowAjax==true){ 
alert('in selYorkshireRegion');
var catID = '' 
if(document.getElementById('lstYorkshireRegion').multiple == true){ 
for(var x=0;x<document.getElementById
('lstYorkshireRegion').options.length;x++){ 
if(document.getElementById('lstYorkshireRegion').options
[x].selected==true){ 
catID += document.getElementById('lstYorkshireRegion').options
[x].value + ',' ; 
} 
} 
}else{ 
catID = document.getElementById('lstYorkshireRegion').value; 
} 
gstrList='lstCity'; 
alert('it is "' + catID + '"'); 
if(catID=='' || catID==','){
catID = 0;
}else{
if(catID.substring(catID.length-1,catID.length)==',') 
catID = catID.substring(0,catID.length-1); 
if(catID.substring(0,1)==',') 
catID = catID.substring(1,catID.length); 
} 
var qry = 'cat=' + escape(catID);
alert(qry) 
xmlhttpPost
('/jobboard/scripts/ajax/categories.asp',qry,'displayListResult'); 
}
setTimeout('doChain(1)', 500);
}

As I said it works fine in firefox but not IE.
The select in question is drawn out when the page is rendered as such:

<dt><label for="lstYorkshireRegion">Region:</label></dt><dd><select 
id="lstYorkshireRegion"  name="lstYorkshireRegion" size="1"  
<option value="" selected="selected">Any</option><option value="1393" 
>South Yorkshire</option>
<option value="1394" >North Yorkshire</option>
<option value="1395" >West Yorkshire</option>
<option value="1396" >East Yorkshire</option>
<option value="1453" >Outskirts of Yorkshire</option>
</select>
</dd>


<script type="text/javascript"> 
<!--
var myelem1 = document.getElementById('lstYorkshireRegion'); 
if(myelem1.attachEvent) 
myelem1.attachEvent('onchange', selYorkshireRegion); 
else 
myelem1.addEventListener('change', selYorkshireRegion, false);
//--> 
</script>

Can anyone help me pls. Thanks in advance.
Rob






------------------------ Yahoo! Groups Sponsor --------------------~--> 
Protect your PC from spy ware with award winning anti spy technology. It's free.
http://us.click.yahoo.com/97bhrC/LGxNAA/yQLSAA/9rHolB/TM
--------------------------------------------------------------------~-> 

Unsubscribe
[email protected]

List info
http://www.quirksmode.org/dom/list.html 
Yahoo! Groups Links

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

<*> 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/