iPhone not responding to click event

Question

I am trying to get this nav bar to respond on mobile Safari. It works fine on iPhone simulator. From this answer thought it would work by simply adding cursor:pointer property but still no luck. How do I use jQuery for click event in iPhone web application Any help much appreciated (the code works fine on desktop browsers).

$(document).ready(function(){

//Click nav links
$('.nav li').click(function(e){
    $('.nav li').attr('id', ''); //navtabs inactive
    $(this).attr('id', 'activetab'); // clicked tab active

    //hide  fieldsets
    $('fieldset').attr('class', 'hidden');

    whichitem=$(this).attr('title'); //get title nav clicked

    //show class cleared
    $("fieldset[title='"+whichitem+"']").attr('class', ''); 
});

});

and the form:

<div class="nav">
<ul>
    <li id="activetab" title="<?php echo _('Login'); ?>"><?php echo _('Step 1'); ?></li>
    <li title="<?php echo _('Professional Details'); ?>"><?php echo _('Step 2'); ?></li>
    <li title="<?php echo _('Optional'); ?>"><?php echo _('Step 3'); ?></li>
</ul>
</div>

    <button type="submit"><?php echo _('Submit'); ?></button>
</fieldset>
</form>

Answer 1

:) Fixed

$(document).ready(function(){
var ua = navigator.userAgent,
event = (ua.match(/iPhone/i)) ? "touchstart" : "click";