javascript - 单击按钮更改 div id？

Question

现在我正在努力创建一个可以在主页上展示多个图像的网站，可以通过单击按钮循环显示这些图像。几乎像画廊，但更适合页面预览。我想弄清楚的是如何在单击按钮时更改 div 的 ID/类。

我已经查看了其他一些问题，但没有一个问题表明 4 个不同的 ID 会发生这种情况。

我是 JavaScript 的新手，正在尝试找出最适合我的情况。

这是我为我的页面制作的 jsFiddle。目标是让顶部的按钮在点击时将绿色 div #Filler 更改为新的 id/class。

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 类元素的。

Answer 1

使用Javascript:

document.getElementById('Filler').id = 'Filler2';