Untitled

<html>
<head>
<link rel="stylesheet" href="style.css">
<title>Zwierzęta</title>
<script>
function pingwin(){
document.getElementById("wynik").innerHTML="PINGWIN";
document.getElementById("wynik").innerHTML='<img src="pingwin.png" width="100px" height="100px" id="pingwin" onclick="pingwin()">';
document.getElementById("treść").innerHTML="W mej lodówce, tuż obok wędliny,<br>Zamieszkały trzy średnie pingwiny:<br>Gołe stopy, czarno-białe garniturki,<br>A na ciele ani śladu gęsiej skórki.";
}
function slon(){
document.getElementById("wynik").innerHTML="SLON";
document.getElementById("obraz").innerHTML='<img src="slon.png" width="100px" height="100px" id="slon" onclick="slon()">';
document.getElementById("treść").innerHTML="Ten słoń nazywa się Bombi.<br>Ma trąbę, lecz na niej nie trąbi.<br>Dlaczego? Nie bądź ciekawy -<br>To jego prywatne sprawy.";
}
function mis(){
document.getElementById("wynik").innerHTML="MIS";
document.getElementById("obraz").innerHTML='<img src="mis.png" width="100px" height="100px" id="mis" onclick="mis()">';
document.getElementById("treść").innerHTML="MIŚ JEST MAŁY I PUCHATY<br>MIS JEST FAJNY I KUDŁATY<br>MIŚ JEST GRUBY JAK TA KULA<br>MISIA ZAWSZE SIĘ PRZYTULA";
}
function zebra(){
document.getElementById("wynik").innerHTML="ZEBRA";
document.getElementById("obraz").innerHTML='<img src="zebra.png" width="100px" height="100px" id="zebra" onclick="zebra()">';
document.getElementById("treść").innerHTML="Przyszła zebra do malarza.<br>– Moja barwa mnie przeraża!<br>Dłużej już tak być nie może,<br>Ktoś zapomniał o kolorze!";
}
function hippopotam(){
document.getElementById("wynik").innerHTML="HIPPO";
document.getElementById("obraz").innerHTML='<img src="hippo.png" width="100px" height="100px" id="hippopotam" onclick="hippopotam()">';
document.getElementById("treść").innerHTML="- Hipopotam jest istotą,<br>która bardzo lubi błoto. -<br>Tak powiedział hipopotam<br>i od razu – chlup! – do błota.";
}
</script>
</head>
<body>
<header>
<div id="tabela">
<table id="dane">
<tr>
<td><img src="pingwin.png" width="100px" height="100px" id="pingwin" onclick="pingwin()"></td>
<td><img src="slon.png" width="100px" height="100px" id="slon" onclick="slon()"></td>
<td><img src="mis.png" width="100px" height="100px" id="mis" onclick="mis()"></td>
<td><img src="zebra.png" width="100px" height="100px" id="zebra" onclick="zebra()"></td>
<td><img src="hippo.png" width="100px" height="100px" id="hippopotam" onclick="hippopotam()"></td>
</tr>
</table>
</header>
<aside>
<table id="koniec">
<tr><td id="wynik"></tr>
<tr><td id="obraz"></tr>
<tr><td id="treść"></tr>
</table>
</aside>
</body>
</html>