Choosing the anchor text in this hide/show script?

Hello, I use a show/hide script on my website and I really like it. However, when there is text that is expandable, it will only show a link that says "(show)". What would be great is if the script could be modified so I could decide what the link says via HTML/DIV.

Can someone look at this and see if that's possible?

var COLLAPSABLE_PARENT_NAME = "more";
var COLLAPSABLE_PARENT_TYPE = "span";
var COLLAPSABLE_CHILD_TYPE = "p";

var COLLAPSABLE_EXPAND = "(show)";
var COLLAPSABLE_SHRINK = "(hide)";

init = function() {
    if(document.getElementById && document.createTextNode) {
        var entries = document.getElementsByTagName(COLLAPSABLE_PARENT_TYPE);
        for(i=0;i<entries.length;i++)
            if (entries[i].className==COLLAPSABLE_PARENT_NAME)
                assignCollapse(entries[i]);
    }
}

assignCollapse = function (div) {
    var button = document.createElement('a');
	button.className = "more";
	button.setAttribute('expand', COLLAPSABLE_EXPAND);
    button.setAttribute('shrink', COLLAPSABLE_SHRINK);
    button.setAttribute('state', -1);
    button.innerHTML='dsds';
    div.insertBefore(button, div.getElementsByTagName(COLLAPSABLE_CHILD_TYPE)[0]);

    button.onclick=function(){
        var state = -(1*this.getAttribute('state'));
        this.setAttribute('state', state);
        this.parentNode.getElementsByTagName(COLLAPSABLE_CHILD_TYPE)[0].style.display=state==1?'none':'block';
        this.innerHTML = this.getAttribute(state==1?'expand':'shrink');
    };                   
    button.onclick();
}


window.onload=init;

Code (markup):

You can see the script in action here - it would be great if the the actual "Year" could be the link rather than the "(show)" text next to it.

I hope you can help, thanks

 

Looking at the source code on your web page, it would get a little messy if you wanted to use the current expand/collapse script to do those things you said you wanted to accomplish. However, it could be done.

My suggestion would be to use a different approach altogether. Here are a couple of alternatives:

Expandable/Collapsible Content

Collapse & Expand

DHTML Expand & Collapse Div


Hope that helps!

 

The thing is, with this script I don't need to specify an ID for the expandable text, most show/hide scripts give an ID to the hidden text and that is then referred to when a user clicks the expand link.

So really I would love to keep using this script as it can easily be implemented into my forum as people don't need to create a unique ID every time.

 

Anyone?

 

Thanks WebGyver, I've decided to use the first one you gave me.