Issue with dropdown list (unordered) and iPhone (can't click)

Just did a quick overhaul for a client and the designer boxed me into some things I didn’t want to do, now I have an iPhone issue.

The site is

In the free quote box you will see a box for property state, as they type I dynamically grab states (that match what they are typing) via an AJAX call, the results show being an unordered list. When the user clicks the state they want it fills in the text box (along with a hidden field for the county AJAX).

The owner just emailed me saying the states show but you can not ‘click’ on a state (yes I realize you don’t click on an iPhone).

Here’s the code that drives this:

	$('#quote_state').keyup(function()	{
		if (jQuery.trim($(this).val()).length != 0)	{

				async: false,
				type: 'POST',
				url: '/functions/get_states.php',
				data: '&letters=' + $(this).val() + '&which=state',
				success: function(data, textStatus){
		else	{


	$('.st_dr').live('click', function()	{
		$('#state_abbr').val(str_replace('st_', '', $(this).attr('id')));

Tried to research it but can’t find anything similar to what I’m doing here so what the heck do you use to make these phones work right on this?


There are lots of discussions online about the click event not working properly on iPhones, but there are fixes, such as here:’t+work

(Not sure if that helps. I admit I’m not a jQuery chap. :slight_smile: )