ajaxでボタンを押すごとに写真の表示を変える – ソフトウェアエンジニアの技術ブログ：Software engineer tech blog

buttonをclickするごとに、var iを++;して、表示を変えます。

<body>
    <button class="button">写真を表示</button><br>
    <img src="img/01.gif">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
</body>
<script>
var img = ['img/01.gif','img/02.gif','img/03.gif','img/04.gif'];
var i = 1;
$(document).ready(function(){
    $(".button").click(function(){
        $("img").attr("src", img[i]);
        i++;
        if(i == (img.length)){
            i = 0;
        }
    });
});
</script>

ははーん、これは色々応用できそうですね。