Assigning one css class, need to differentiate between them!

Assigning one css class, need to differentiate between them!

Hey guys,

I am pretty new to jQuery and have looked around the place and can not find the solution to the problem I am currently having.

Ok, i'll get straight into it, so I have an anchor tag as follows:

<a href="" id="<?=$memberPhoto['id']?>" class="btnApprove" />

Where the id is assigned to the id of the photo in the database, and the class "btnApprove" relates to the CSS

.btnApprove {
display: block;
width: 25px;
height: 20px;
background: transparent url(/default/images/system/btn_approve_1.png) repeat-y scroll 0 0;
}

Now, I also have a .btnApprove:hover that changes the image.

That is good and all, but how do I assign this in jQuery? I can't use $(".btnApprove").click because there are different things that are being moderated in the backend, such as new members, photos, user comments, login changes, competition entries etc etc .. so there will be various anchor tags that have the class btnApprove but all do different things involving Ajax (call different scripts).

The only solution I have found so far is having a class called .btnApproveMemberPhoto and .btnApproveMember and so on, which becomes very redundant, as they all share the same css.

Any help would be much appreciated!