使用jquery点击切换

        点击切换有很多种方法，今天记录一种超级简单也是最笨的jquery的方法。

        HTML如下：

                   <div class="guides">
                        <ul>
                            <a href="javascript:;"><li id="click1">111</li></a>
                            <a href="javascript:;"><li id="click2">222</li></a>
                            <a href="javascript:;"><li id="click3">333</li></a>
                        </ul>
                    </div>

                   <div  id="guides1">111
                   </div>
                    <div  id="guides2">222
                   </div>

                   <div  id="guides3">333
                   </div>

        jQuery如下：

              $("#guides1").show();
              $("#guides2").hide();
              $("#guides3").hide();

            //上面的代码是初始化显示的效果，一开始让guides1显示，guides2和guides3隐藏。

              $("#click1").click(function(){
                  $("#guides1").show();
                  $("#guides2").hide();
                  $("#guides3").hide();
               });
               $("#click2").click(function(){
                   $("#guides2").show();
                   $("#guides1").hide();
                   $("#guides3").hide();
              });
              $("#click3").click(function(){
                   $("#guides3").show();
                    $("#guides1").hide();
                    $("#guides3").hide();
               });

        剩下的就是css样式的问题。