Question about getting references to elements 1

[Perra]

I have a CV in which I would like to expand and collapse the headings in order
to show and hide the text under the heading. As it is now, I have to write a new function
for every heading in the CV.

Is there a way to get a reference to clicked heading, that is, the <p = id = &quot;element_1&quot; and
then pass it as an argument to the function expandIt(element_1_ref), that is, upon clicking
each header respectively.

Up to now, I will have to write a new &quot;expand/collapse-function&quot; for every new header
I append to my CV. Easy, yes, but programmatically not very well.

The code below works, but I would like to get some tips in order to get it
working according to the above, preferred scenario:
-------------------------------------------------
<A HREF=&quot;javascript:expandIt(element_1)&quot; STYLE = &quot;text-decoration:none&quot;><font face=&quot;Verdana, Arial, Helvetica, sans-serif&quot; color=&quot;#000000&quot;>Programmet
för Informatik med systemvetenskap 120 p.</font></A>
<P id = &quot;element_1&quot; STYLE = &quot;display:none&quot;>
TEXT....TEXT....TEXT...TEXT
</p>

<script language = &quot;Javascript&quot;>
function expandIt(element_1_ref)
{
element_1_ref.style.display = (element_1_ref.style.display == &quot;none&quot; ) ? &quot;&quot; : &quot;none&quot;;
}
</script>
----------------------------------------------------
Grateful for tips!

/Perra (Systems developer from Sweden)

 

[GIGN]

Pass the object using this:

onClick=&quot;expandIt(this)&quot;

passes whatever object that onClick belongs to, essentially you are inside the object, when you are inside the tags like that.
this refers to the object you are currently in - hence you can use this to mean the same thing as window.

;-)