jQuery/Javascript to move and force-click?

I need to use jQuery or JS here. I have a glossary page with a bunch of terms on it. Each term link has a unique rel which is used to perform an ajax request to pull the definition. Each term link is also wrapped in a div with a unique ID, which is the word/term. This all works because someone smart who isn't me 开发者_JAVA百科wrote it.

What isn't working: Some terms have a 'see also' output which references other terms on the page. Basically, I want to do something like this...

<h1>Term 5</h1>
<p>Here's the definition.
See Also:
<a href="#">Term 1</a>
<a href="#">Term 2</a>
<a href="#">Term 3</a>
</p>
....
<div id="Term 1" class="clickEventJSclass">Term 1</div>
<div id="Term 2" class="clickEventJSclass">Term 2</div>
<div id="Term 3" class="clickEventJSclass">Term 3</div>

I need to be able to click on term 1, 2, etc.. in the output of one definition and have it move to AND click the term to open the new definition. Can this be done in a dynamic way where one function could handle all of the link IDs? My example has no link ID given, but I can make a unique one for each term if necessary. Can anyone help?

---

Using jQuery you could force the click event. The anchor tags will need something like:

<a href="#" onclick="javascript_function('Div ID')">Term</a>

You will need another javascript function:

function javascript_function(div) {
    $('#' + div).trigger('click');
}

---

Here's a fiddle to illustrate:

http://jsfiddle.net/AwQZf/1/

To try it out, expand TWO and click on the link within that says FIVE. The link will take you down to FIVE and expand it.

There are 2 pieces here. First, to have the page move to where FIVE is, simply put #id as the href. In this case <a href="#five". This, when clicked, will take you down to the element which has the id of five.

The 2nd part is the click:

$("#fivelink").click(function(){
       $("#five").click(); 
    });