<table>
<tr><td>First Row</td><td>2 Row</td><td>1 last</td></tr>
<tr><td>Middle Row</td><td>2 Row</td><td>2 last</td></tr>
<tr><td>Last Row</td><td>2 R开发者_开发技巧ow</td><td>3 last</td></tr>
</table>
$('tr').each(function(index) {
$("td:last").css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
LIVE: http://jsfiddle.net/DxVG5/1/
why this working only for 3 last, but on 1 last and 2 last no? how can i fix it?
Your example will get the last td
in each tr
because using :last literally gets the last td
in the table
. Try this instead:
$('tr td:last-child').css({
backgroundColor: 'yellow',
fontWeight: 'bolder'
});
Specify the context in which that TD
is the last one. In your case which TR
. Passing the second argument to the jQuery constructor should do it.
$('tr').each(function(index) {
// ------------|
// | here
$("td:last", this).css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
Try this instead:
$('tr').each(function(index) {
$("td:last-child").css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
http://jsfiddle.net/andresilich/DxVG5/11/
You need to add the context of the td, you're already in a for loop so the 'this' variable can be used. In this context 'this' is equal to the tr you're currently iterating on.
$('tr').each(function(index) {
$("td:last",this).css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
You need to make sure you are only looking through TD
s inside the current TR
, by using $(this).find()
or by adding this
as the second argument in your selector.
$('tr').each(function(index) {
$("td:last",this).css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
I've updated your fiddle: http://jsfiddle.net/nslr/DxVG5/4/
You were checking for the global $('td:last')
, not the one for the specific row, which is done like this (inside the .each()
)
$(this).find('td:last')....
Assign last-child
of the tr
$('tr').each(function(index) {
$("td:last-child").css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
Check this http://jsfiddle.net/ucCQH/5/
try this
$('tr').each(function(index) {
$("td:last", this).css({backgroundColor: 'yellow', fontWeight: 'bolder'});
});
精彩评论