iPad jQuery hover / click? What in the World?

[Trips Left]

I've got a menu item that when hovered, swaps an image, and if clicked goes to a page, however my hovers and clicks are being treated the same in ios. Any suggestions. Here is my html:

<div id="bioMenu">
        	<ul>
            	<li class="joemims"><a href="/the-mims-team/our-people/joe-mims-president-mims-distributing-company/">Joe Mims</a></li>
                <li class="chipmims"><a href="/the-mims-team/our-people/chip-mims-ceo-mims-distributing-company/">Chip Mims</a></li>
                <li class="jeffmims"><a href="/the-mims-team/our-people/jeff-mims-chief-sales-officer-mims-distributing-company/">Jeff Mims</a></li>                
            </ul>
        </div><!-- End bioMenu -->
        <div id="bioImage">
        	<img src="images/Bios/bioImage.png" width="326" height="328" alt="" class="replace"/>
        </div><!-- End bioImage -->

And here is my script:

function bioShow(){
	$('#bioMenu').animate({'top' : '115px'}, 700, 'easeOutExpo');
	
	//Joe Mims Mouseover
	$('li.joemims').mouseover(function() {		
		$('img.replace').attr({//Change the src and size info on hover
			src: '/images/Bios/joeMims.png'			
			});
	});
	
	//Chip Mims Mouseover
	$('li.chipmims').mouseover(function() {		
		$('img.replace').attr({//Change the src and size info on hover
			src: '/images/Bios/chipMims.png'			
			});
	});
	
	
	//Jeff Mims Mouseover
	$('li.jeffmims').mouseover(function() {		
		$('img.replace').attr({//Change the src and size info on hover
			src: '/images/Bios/jeffMims.png'			
			});
	});
	

	$('#bioMenu li').mouseout(function() {		
		$('img.replace').attr({//Change the src and size info on hover
			src: /images/Bios/bioImage.png'			
			});
	});
	
	
}//End beerShow()


 $(document).ready(function(){					
	bioShow();
});