Jquery换肤

下面是通过jquery，点击更换背景按钮来触发事件，从而改变body背景图片，先看下面的源码啊：

<meta charset="UTF-8" />
<title></title>
<script src="http://cdn.bootcss.com/jquery/3.0.0-beta1/jquery.js"></script>
<style type="text/css">
*{margin: 0; margin: 0; border: 0;}
    html{width: 100%; height: 100%;}
    body{width: 100%; height: 100%; background-image: url(1.jpg); 

    overflow: hidden;
    font-family: "微软雅黑","'Segoe UI', Tahoma, Geneva, Verdana, sans-serif";
    }

    .content{color: white; background-color: #000; opacity: 0.3;}
    .content h1{font-size: 60px; text-align: center;}
    .content p{text-align: right;}
    .content p input{height: 30px; background-color: orange;  }
    .footer{position: relative;
    width: 1200px;
    height:auto;
    margin: 0 auto;
    margin-top: 50px;
    }
    .f-content{
      color: white;
      width: 1200px;
      margin: 0 auto;
      height:auto;
      font-size: 30px;
     bottom: 0;

    }</style>
<script>
           $(document).ready(function(){

             var imgcount=4;//背景图片数量
             var imgNow=0;//显示的背景图片位置
             $("#bgbtn").click(function(){
                imgNow=(imgNow+1)%imgcount;//数值在0-3之间循环
                bgshow(imgNow) ;
             })

           })
           function bgshow(imgNow){
               var imgArry =new Array("url(1.jpg)","url(2.jpg)","url(3.jpg)","url(4.jpg)");//所需的图片url地址
                 var b=$("body");      
                 var imgsr=imgArry[imgNow];
                 b.css("background-image",imgsr);
           }

    </script>
<h1><code class="hljs xml">周杰伦-晴天</code></h1>
<p><code class="hljs xml"><input id="bgbtn" onclick="test()" type="button" value="点击更换背景" /></code></p>
<p>&nbsp;</p>
<h3><code class="hljs xml">晴天</code></h3>
<p><code class="hljs xml">从出生那年就飘着</code></p>
<p><code class="hljs xml">童年的荡秋千</code></p>
<p><code class="hljs xml">随记忆一直晃到现在</code></p>
<p><code class="hljs xml">rui sou sou xi dou xi la</code></p>
<p><code class="hljs xml">吹着前奏望着天空...<input onclick="bgshow(2)" type="button" value="更多" /></code></p>