jquery与手机不兼容

Question

我有一个jquery的基本响应式菜单代码，它可以在减少桌面上的浏览器宽度方面正常工作，但不能在移动设备本身上工作。代码在这里：

$(document).ready(function(){


    if(document.documentElement.clientWidth < 480){

        $('nav').addClass("wrapper");

        $('.menuresp').click(function(){

            $(this).next('ul').slideToggle();

        });

    }

    else{
    $('nav').removeClass("wrapper");
    }



});

这是nav html：

<nav>
    <div class="menuresp"></div>

    <ul>
        <li><a href="#">Men</a></li>

        <li><a href="#">Women</a></li>

        <li><a href="#">Brands</a></li>

        <li><a href="#">sale</a></li>

        <li><a href="#">blog</a></li>
    </ul><!-- resp menu -->

    <div class="cb"></div>
</nav>

这是小提琴：http://jsfiddle.net/uUySL/

另外，我认为jquery在移动设备上根本不起作用，因为我有另一个小的slideToggle脚本无法正常工作。请告诉我哪里错了。我在默认浏览器上测试了micormax canvas2 mobile。