Get third a tag within a table

Question

I want to click on 3rd a tag and if 3rd a tag is clicked then I want to do few actions. I am trying to select the 3rd a tag by javascript.

I checked other posts within this forum however they only mentioned how to get a single a tag which is inside a td. I appreciate any comment or sample.

<tr>
    <td>
        <div class="btn-group my_first_button">
              <a class="btn btn-xs btn-danger my_anchor1">1</a>
              <a class="btn btn-xs btn-primary my_anchor2">2</a>
              <a class="btn btn-xs btn-success my_anchor3">3</a>
        </div>
    </td>
</tr>

Here is the javascript file that I am working on:

$('.my_first_button:td a').click(function(){
    //Some other actions
});

Answer 1

You could use the :nth-child selector of JQuery.

Answer 2

Try this:

$('.my_first_button .my_anchor3').click(function(){
    //Some other actions
});

Or use the :nth-child CSS selector:

$('.my_first_button a:nth-child(3)').click(function(){
    //Some other actions
});