Home/ Questions/Q 526687
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T08:48:11+00:00

I have this: jQuery(document).ready(function(){ jQuery(‘a.color2030’).click( function() { jQuery(‘tbody’).hide(); jQuery(‘tbody.color2030’).show(); }); jQuery(‘a.color2031’).click( function() { jQuery(‘tbody’).hide();

  • 0

I have this:

jQuery(document).ready(function(){
    jQuery('a.color2030').click( function() {
        jQuery('tbody').hide();
        jQuery('tbody.color2030').show();
    });
    jQuery('a.color2031').click( function() {
        jQuery('tbody').hide();
        jQuery('tbody.color2031').show();
    });
...
...
    jQuery('a.color2037').click( function() {
        jQuery('tbody').hide();
        jQuery('tbody.color2032').show();
    });
});

But would like not to have to repeat the block of code for each link.
I can get the id from the link in any way. It could be color2030 etc.

I have tried:

<a href="#color2030" class="color2030" id="test2030">
<a href="#color2031" class="color2031" id="test2031">
<a href="#color2032" class="color2032" id="test2032">

And in jQuery:

jQuery('a').click(function() {
    // this works
    var id = 'test';
    alert(id); // will alert 'test'

    // this does not work
    var id = $(this).attr('id');  //update2: should have been jQuery(this...
    alert(id); // no alert but error on page
});

But I cannot seem to get hold on the id. The “var id” line seems to have an error or so.
Is there another way to get read an id/class or other tag from an a-tag when pressed?

BR. Anders

UPDATED:
due to a typo that two persons spotted in not much more than 30 sek!

UPDATE2 and solved!
The error I could not spot was the $(this) where it should have been jQuery(this) in the ‘var id’ line

Final update with solution
This is was is doing the trick

jQuery(document).ready(function(){
    jQuery('a').click( function() {
        var id = this.id;
        alert(id);

        jQuery('tbody').hide();
        jQuery('tbody.'+id).show();
    });

});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    There are a few bugs. Here is the code refactored and working:

    <html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function() {
            jQuery('a').click(function() {
                alert(this.id);
            });
        });
    </script>   

</head>
<body>

<a href="#color2030" class="color2030" id="test2030">test2030</a>
<a href="#color2031" class="color2031" id="test2031">test2031</a>
<a href="#color2032" class="color2032" id="test2032">test2032</a>

</body>
</html>
    1. onclick isn’t a jQuery method. Please use click.
    2. this is an HTML DOM Anchor Object. Therefore, calling the property id will return its value.

    Hope this helps.

    • 0