Witam, chcę zrobić na stronie coś w rodzaju spoilera, tylko że chce mieć przyciski od pokazywania/chowania obok siebie w tym samym divie. Problem polega na tym, że gdy umieszczam dwa przyciski <input type="image"..> obok siebie to zawsze oba przyciski działają do rozwijania pierwszego ukrytego diva.

Kod zaczerpnąłem z kodu spoilera na fora internetowe, wygląda tak:
[PHP] pobierz, plaintext 
  1. <input type="image" src="wyslij.png" value="Wy?lij znajomemu" style="width:138px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';		this.innerText = ''; src = 'ukryj-formularz.png'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; src = 'wyslij.png'; }">
[PHP] pobierz, plaintext


Myślę że problem tkwi w getElementsByTagName('div')[1] i getElementsByTagName('div')[0], jednak nie wiem jak przypisać im np. id diva, albo title, tak by działało. Czy da się zrobić, by działały dwa takie przyciski dla pokazywania dwóch różnych tekstów?


gotowy skrypt do ukrywania wygląda mniej więcej tak:
[PHP] pobierz, plaintext 
  1. <div style="margin:20px; margin-top:5px"><div class="quotetitle"><input class="button2 btnlite" type="button" value="Pokaż" style="text-align:center;width:100px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';      this.innerText = ''; this.value = 'Ukryj'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Pokaż'; }" /></div><div class="quotecontent"><div style="display: none; width: 600px; overflow: auto;">UKRYRY TEKST</div></div></div>
[PHP] pobierz, plaintext


a mi są potrzebne przyciski obok siebie, czyli coś takiego:
[PHP] pobierz, plaintext 
  1. <div style="margin:20px; margin-top:5px"><div class="quotetitle"><input class="button2 btnlite" type="button" value="Pokaż" style="text-align:center;width:100px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';      this.innerText = ''; this.value = 'Ukryj'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Pokaż'; }" /><input class="button2 btnlite" type="button" value="Pokaż" style="text-align:center;width:100px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';      this.innerText = ''; this.value = 'Ukryj'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Pokaż'; }" /></div><div class="quotecontent"><div style="display: none; width: 600px; overflow: auto;">UKRYRY TEKST</div></div></div><div style="margin:20px; margin-top:5px"><div class="quotetitle"></div><div class="quotecontent"><div style="display: none; width: 600px; overflow: auto;">UKRYRY TEKST2</div></div></div>
[PHP] pobierz, plaintext
lecz to niestety nie działa.. (oba buttoniki pokazują ten sam ukryty tekst z pierwszego diva)