<html>
<head>
<title>CSS Toggle Javascript Example</title>
</head>
<body>

<style>
.class1 {
    background-color: red;
    color: white;
    width: 100px; height: 100px; border: 1px solid black; text-align: center;
}
.class2 {
    background-color: white;
    color: red;
    width: 100px; height: 100px; border: 1px solid black; text-align: center;
}
</style>

<script language="JavaScript">
function toggle() {

    var obj = document.getElementById("box");

    if (obj.className == "class1") {
        obj.className = "class2";
    } else {
        obj.className = "class1";
    }
}
</script>

<div class="class1" id="box" onClick="toggle();">
Click Me!
</div>

</body>
</html>