Hey Leute!

Hier eine vermutlich sehr simple Frage, allerdings komme ich trotzdem nicht allein auf die Antwort....
Ziel ist es, mehrere ausklappbare FAQ Fragen zu erstellen. Beim Betreten der Seite sollen die Fragen zugeklappt sein. Hierfür habe ich folgenden Code verwendet:

HTML-Code:
<p><span style="display: block; border: #cccccc 1px solid; padding: 10px; color: #004185; cursor: pointer;" onclick="document.getElementById('text').style.display='block';
document.getElementById('an').style.display='none';
document.getElementById('zu').style.display='block'" id="an" class="item"> <span class="fa fa-plus"> </span> Noch nicht angeklick!</span> <span onclick="document.getElementById('text').style.display='none';
document.getElementById('an').style.display='block';
document.getElementById('zu').style.display='none'" id="zu" style="display: block; border: #cccccc 1px solid; padding: 10px; color: #004185; cursor: pointer; a: hover { background: #004185 };" class="item"><span class="fa fa-plus"> </span> Angeklick!</span></p>
<div id="text" style="display: none;">Test Text.</div>
Das klappt soweit auch gut! Mein Problem ist nur, dass beim betreten der Seite quasi beide Reiter für "Angeklickt" und "noch nicht angeklickt" zu sehen sind. Klickt man dann auf die Frage, verschwindet der überflüssige Reiter und es funktioniert, wie es soll.

Ich blicks nicht wirklich, wäre dankbar für alle Hilfen!
Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!