javascript - 別のイメージ コンテンツ セットで div イメージ コンテンツを変更することはできません

Question

divに配置された一連の画像が一列に並んでいます。

サンプル

<div id="divd">
<img src="images/A.png" />
<img src="images/B.png" />
<img src="images/C.png" />
<img src="images/D.png" />
<img src="images/E.png" />
<img src="images/F.png" />
<img src="images/G.png" /> 
<img src="images/H.png" />
<img src="images/I.png" /> 
<img src="images/J.Png" />
<img src="images/K.Png" />
<img src="images/L.png" /> 
<img src="images/M.png" />
<img src="images/N.png" />
<img src="images/O.png" />
<img src="images/P.png" />
<img src="images/Q.png" />
<img src="images/R.png" />
<img src="images/S.png" />        
<img src="images/T.png" />
<img src="images/U.png" />
<img src="images/V.png" />
<img src="images/W.png" />
<img src="images/X.png" />
<img src="images/Y.png" />
<img src="images/Z.png" />
</div>
<button onclick='changeMe()'>Click It</button>

この div を別の画像セットに置き換えたいのですが、どのように置き換えることができますか。

フィドルでの私のコーディングはhereです。

Answer 1

jQuery .html() 属性について読む -> http://api.jquery.com/html/

Answer 2

これを試して：

var toggle;

function changeMe() {
    toggle = !toggle;
    if (toggle) {
        document.getElementById('divd').innerHTML = "<a href='www.google.com'>Hello</a>";
    } else {
        document.getElementById('divd').innerHTML = '<img src="images/A.Png" /><img src="images/B.Png" /><img src="images/C.Png" /><img src="images/D.Png" /><img src="images/E.Png" /> <img src="images/F.Png" /><img src="images/G.Png" />  <img src="images/H.Png" /><img src="images/I.Png" /> <img src="images/J.Png" /> <img src="images/K.Png" /><img src="images/L.Png" /><img src="images/M.Png" /><img src="images/N.Png" /><img src="images/O.Png" /><img src="images/P.Png" /><img src="images/Q.Png" /><img src="images/R.Png" /> <img src="images/S.Png" /><img src="images/T.Png" /><img src="images/U.Png" /><img src="images/V.Png" /><img src="images/W.Png" /><img src="images/X.Png" /><img src="images/Y.Png" /><img src="images/Z.Png" />';
    }
}

フィドル