クリックでそのCSSのデザインに切り替えます

表示中:Default
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script type="text/javascript" src="http://example.com/sample.js"></script>
</head>
<body>
  <div class="content">
    <a href="http://exapmle.com">link</a>
    <!-- コメントアウト -->
    これはサンプルです。
    SyntaxHighlightで行をハイライト表示
  </div>
</body>
body {
  padding: 5px 10px 15px 10px;
}
/* コメントアウト */
#idname,
.classname {
  background-image: url("img/sample.png"); 
  border: solid 1px #666666;
}
function getclass(name) {
  var list = document.getElementsByClassName(name);
  return list;
}
//コメントアウト
var obj = getclass('sample');
for (var i = 0; i < obj.length; i++) {
  alert ('code:' + obj[i].innerHTML);
}