javascript - ボタンのクリックで div id を変更しますか?

Question

現在、ホームページに複数の画像を表示し、ボタンをクリックするだけで循環できる Web サイトの作成に取り組んでいます。ほとんどギャラリーに似ていますが、ページのプレビューに適しています。私が理解しようとしているのは、ボタンがクリックされたときに div の id/class を変更する方法です。

私は他のいくつかの質問を見てきましたが、4つの異なるIDでこれが起こっていることを示すものはありません.

私は JavaScript に非常に慣れていないため、自分の状況に最適な方法を見つけようとしています。

これが、自分のページ用に作成した jsFiddle です。目標は、上部のボタンをクリックして緑色の div#Fillerを新しい ID/クラスに変更することです。

http://jsfiddle.net/xCGDT/1/

#Filler {
margin: auto;
max-height: 700px;
width: 1400px;
background-color: green;
max-width: 1366px;
height: 800px;
z-index: 1;
margin-top: -250px;
overflow: inherit;
background-image: url(nature5.jpg);
animation: Filler 1s 1;
-webkit-animation: Filler 1s 1;
transition-timing-function: ease;
-webkit-transition-timing-function: ease;
opacity:1; }

に変更

#Filler2 {
margin: auto;
max-height: 700px;
width: 1400px;
background-color: red;
max-width: 1366px;
height: 800px;
z-index: 1;
margin-top: -250px;
overflow: inherit;
animation: Filler 1s 1;
-webkit-animation: Filler 1s 1;
transition-timing-function: ease;
-webkit-transition-timing-function: ease;
opacity:1;

}

私が言ったように、私はこれに非常に慣れていません。これは WebDesign クラス プロジェクト用です。