current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

I have a table whose border is set as 1px solid silver from an external style sheet(some .css file). I have no control over this file.

This is the css: my_table tbody td { font: 8.5pt verdana, sans-serif; border-top: solid 1px silver; border-bottom: solid 1px silver; overflow: hidden; padding: 0px 3px 0px 2px; }

Now I want to change the border color of the last row in the table to black. Im trying to use the following jQuery statement for this.

$('#table_1 tr:last').css('border', '1px solid black');

But this does not seem to work. How can I do this with JQuery/JavaScript?

share|improve this question

1 Answer 1

up vote 1 down vote

If it's the TDs you're after, you need to address them:

$(document).ready(function(){
  $('#table_1 tr:last td').css('border', '1px solid black');
});

This code will wait for the DOM to be ready and then apply the border on the TDs in the last row.

Edit: Seeing your CSS declaration, you need to make the style more specific. Here's how (with the class name):

$(document).ready(function(){
  $('.my_table > tbody tr:last td').css('border', '1px solid black');
});

If worse comes to worse, go for $('table.my_table > tbody tr:last td').

share|improve this answer
2  
Any explanation to that downvote? –  Gert Grenander Jul 13 '10 at 22:53
    
Something strange happens when I do this: The bottom border only becomes black. Other borders are still silver. But when I use 2px solid black, that gets applied to all borders. Not really sure why this happens. –  user343409 Jul 13 '10 at 22:56
    
Sounds strange. Would you mind posting the code? Do you have anything else in the table? –  Gert Grenander Jul 13 '10 at 22:59
    
Sorry Gert. Your answer is very useful. I did not mean to downvote. Im very new to this forum and I was playing around and that became a downvote. Im trying to undo that. Apologies once again! –  user343409 Jul 13 '10 at 23:01
    
This is my css: .my_table tbody td { font: 8.5pt verdana, sans-serif; border-left: solid 1px black; border-right: solid 1px black; border-top: solid 1px silver; border-bottom: solid 1px silver; overflow: hidden; padding: 0px 3px 0px 2px; } My table is very simple. Just has 2 columns and 15 rows. No other javascript/jquery features. 'my_table' is the class for the table. Basically last column has grandtotal and has to be prominent. So I want a black border for it. I now use the jquery code you provided –  user343409 Jul 13 '10 at 23:06

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.