Погите решить проблему я уже замучался.
<!doctype html>
<html>
<head>
<style>
.reveal * {display:none;}
.reveal *.handle{display:block}
</style>
<script>
window.onload = function(){
var elements = document.getElementsByClassName("reveal");
for(var i = 0; i < elements.length; i++){
var elt = elements[i];
var title = elt.getElementsByClassName("handle")[0];
addRevealHandler(title, elt);
}
function addRevealHandler(title, elt){
title.onclick = function(){
if(elt.className == "reveal") elt.ClassName = "reveald";
else if (elt.className == "reveald") elt.ClassName = "reveal";
}
}
}
</script>
<body>
<div class = "reveal">
<h1 classs = "handle">Щелкните здесь что бы увидеть скрытый текст</h1>
<p>Этот абзац невидим. Он появляется после щелчка на заголовке</p>
</div>
</body>
</head>
</html>
И с часами тоже беда
<!doctype html>
<html>
<head>
<meta charset = "utf8">
<script>
function displayClock(){
var elt = document.getElementById(clock);
var now = new Date;
elt.innerHTML = now.toLocaleString();
setTimeOut(displayClock, 1000);
}
window.onload = displayClock;
</script>
<style>
#clock {
font:bold 24pt sans;
background:#ddf;
padding:10px;
border: solid black 2px;
border-radius:10px;
}
</style>
</head>
<body>
<h1>Цифровые часы</h1>
<span id = "clock"></span>
</body>
</html>