jquery access second class

I have the following structure on a website I am building

<td class="h开发者_运维知识库eader link" id="link-XXX"><a href="/XXX>XXX</a></td>

I am using jquery to change the background color upon selection of the table. What I would like to accomplish is also make the font of XXX go to bold upon selection (which is controlled by link class).

I am using $(document).ready(function() { $("#link-XXX).css('background-color', '#EBA521'); }); to change the background color and it works

How do I access the link class and change the font of XXX to bold?

I tried

$("#link-XXX").css('font-weight', 'bold);  

but it doesn't work.

Try setting the anchor instead, like so:

$("#link-XXX a").css('font-weight', 'bold);

To make this even better, I'd suggest adding/removing a class to the <tr> or <td> every time the row is selected/de-selected. And then control the style of the <td> or <a> using CSS, like so:

.selected a
{
   font-weight:bold;
}

You can add/remove class by doing this

$('#link-XXX').addClass('selected');

and

$('#link-XXX').removeClass('selected');

You currently applying style to the td. Rather than you have tio apply css to the anchor tag. Try this $("#link-XXX a").css('font-weight', 'bold');
It will work. If you want to add and remove classes, there is function addClass() and removeClass in jquery which you can use. Have a look at this link

I'd suggest not complicating things so much, and using the changed class-name, in the css, to effect the change in font weight, rather than using jQuery to achieve much the same thing in a more complicated manner:

.link-xxx a {
    font-weight: bold;
}

/* or */

.link-xxx {
    font-weight: bold;
}
.link-xxx a {
    font-weight: inherit;
}