单一图片切换jquery

<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
        <style>
            .for{overflow: hidden; width: 100%; zoom: 1;}
            .for ul{list-style: none;}
            .for ul li{ float: left; margin: 5px;}
            .for ul li img{display: block;}
            .btn{ width: 100px; height: 45px; text-align: center; line-height: 45px; background: blue; color: #fff;
                -webkit-user-select:none;

   -moz-user-select:none;

   -ms-user-select:none;

   user-select:none;
            }
        </style>

<div class="for">            <ul>                <li><img id="m1"  src="images/prt_1.jpg"/></li>                <li><img id="m2"  src="images/prt_1.jpg"/></li>            </ul>                </div>        <div class="btn" onclick="forTo()">换菜按钮</div>    </body>    <script>        var m1="images/prt_1.jpg"         var m2="images/prt_2.jpg"          var m3="images/prt_3.jpg"           var m4="images/prt_4.jpg"           var i=0           var a = [m1,m2,m3,m4]// jquery型        $("#m1").click(function(){            i++;            if(i>a.length){                i=1;            }            $(this).prop("src","images/prt_"+i+".jpg");        });   // 方法型            function forTo(){            i++;            if(i>a.length){                i=1;            }            $(‘#m2‘).prop("src","images/prt_"+i+".jpg");        };    </script>