Hello everyone, I am just learning the basics of javascript, and am finding myself stuck. Any help is greatly appreciated.

So, I'm using the below javascript for expand / collapse text, it suffices well. However it will only collapse either table rows, or table data cells. Now, I know that these tags

Code:

{var trs = table.getElementsByTagName('tr');
{var a = trs[i].getElementsByTagName('td')
Make the rows / data cells expand. However, I cannot seem to make it work on headers.

To be lucid, I would like to know what I have to add, or edit to make the below code expand table headers (<th>), and perhaps div tags. The full javascript is thus :

Code:

window.onload = function()
{
var table = document.getElementById('stjorn');
if (table)
{
var trs = table.getElementsByTagName('tr');
for(var i = 0; i < trs.length; i++) 
{
var a = trs[i].getElementsByTagName('td')[0].getElementsByTagName('a')[0];
a.onclick = function()
{
var span = this.parentNode.getElementsByTagName('span')[0];
span.style.display = span.style.display == 'none' ? 'block' : 'none';
this.firstChild.nodeValue = span.style.display == 'none' ? 'More' : 'Less';};
}
}
};
Thank you for your time.