First off, I want to thank everyone for such quick replies.
> That will work, but it's a fairly brittle way to do things. If you add
> another link earlier in your page, it will change the loop indexes and
> you'll have to revise your code to match.
I understand and agree with you. I don't think it's a bulletpoof
technique. I'm honestly just trying this as a way to explore and
understand the language.
> Instead, I would suggest giving each of those A tags its own ID. That way
> you don't have to change your code if you rearrange the tags or add another
> one in the middle. For example:
>
> <div id="myLinks">
> <a href="#" id="one">link 1</a>
> <a href="#" id="two">link 2</a>
> <a href="#" id="three">link 3</a>
> </div>
>
> Now you can simply give each one its own click handler:
>
> $('#one').click( function() {
> // handle click on link 1
> return false; // suppress default action
> });
>
> $('#two').click( function() {
> // handle click on link 2
> return false; // suppress default action
> });
>
> etc.
>
> Or you can still use a switch statement if you want:
>
> $('a').click( function() {
> switch( this.id ) {
> case 'one':
> // handle click on link 1
> break;
> }
> });
I honestly thought of a similar idea using the rel attribute, but this
is not really what I want. I'd like to try doing this without having
to "dirty-up" the markup (no attributes: id, rel, etc. ).
> If there are a large number of A tags in your page, you may want to consider
> event delegation instead. It's pretty easy to do. How many A tags will there
> be?
As of now, there are only four links. Nevertheless, I'm trying to code
this in a way so that the number of links doesn't matter...
