toggle text on multiple buttons

[crw150]

Please point me in the right direction. The following correctly expands or collapses the notes, but the button value does not toggle between "display" and "hide"--only the first button in the document shows the correct text when clicked. I understand that using the [0] I'm selecting only the first button, but how do I fix that? Do I need a variable? A for loop? An array? Should I be using document.f1.b1.value or getElementById or getElementsByTagName? I keep reading but am too new to JavaScript. I can't tell which way to go. Any help would be greatly appreciated!
Thanks,
crw150

function togShow(folderID) {
notedivs = document.getElementById('folder'+folderID);
if (notedivs.style.display=="block" || notedivs.style.display==""){
notedivs.style.display="none";
document.f1[0].b1.value="click to display"; 
}else{
notedivs.style.display="block";
document.f1[0].b1.value="click to hide"; 
}}

<xsl:if test="note">
  <div id="toggleid{generate-id(.)}">
    <form name="f1">					
      <input name="b1" onclick="javascript:togShow('id{generate-id(.)}')" type="button" value="click to hide"/>
    </form>
  </div>						
  <div id="folderid{generate-id(.)}">
    <xsl:apply-templates select="note"/>
  </div><br/><br/>
</xsl:if>

 

[tsuji]

Try taking out [0].

[tt] document.f1.b1.value="click to display";
//etc
document.f1.b1.value="click to hide"; [/tt]

Otherwise to be more certain, pass the button object itself to the handler. Like this.

[tt] <input name="b1" onclick="javascript:togShow('id{generate-id(.)}'[blue],this[/blue])" type="button" value="click to hide"/>[/tt]

Then the handler becomes.
[tt]
function togShow(folderID[blue],obj[/blue]) {
notedivs = document.getElementById('folder'+folderID);
if (notedivs.style.display=="block" || notedivs.style.display==""){
notedivs.style.display="none";
[blue]obj[/blue].value="click to display";
}else{
notedivs.style.display="block";
[blue]obj[/blue].value="click to hide";
}}
[/tt]
- tsuji

 

[crw150]

Leaving out [0] did not work, but using "obj" and "this" did. Thank you SO much!!! I worked on this for days and got nowhere.

Now I just have to get another [Display All | Hide All] function to work at the same time.

As a rank beginner, I sincerely appreciate your help!
crw150