i want to apply some css properties on last tr in table so i have use :last selector but it wont work in ie9 below version so i am trying to do so with "eq()" method but not getting result. It is possible to target last tr with eq() method in jquery.
<script type="text/javascript" src="../jquery/jquery-1.7.min.js"></script>
<script type="text/javascript">
$(function() {
var trNo= $('#compareTable tr');
var NoN= trNo.eq(-1);
NoN.css('border','none')
});
</script>
</head>
<body>
<div class="main">
<div class="compatible">
<h4 class="compatileHeading">8 Matching Compatible Product</h4>
<div class="listingCompatibleProdcut">
<table width="100%" border="0" cellspacing="0" cellpadding="0" id="compareTable">
<tr>
<td width="105" align="center">
<div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div>
</td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
</tr>
<tr>
<td width="105" align="center">
<div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div>
</td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
<td width="105" align="center"><div class="compareBox">
<ul id="compareunorderedList">
<li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li>
<li class="compareTitle">Galaxy S LCD 4GB</li>
<li class="compareCode">GT-19003</li>
</ul>
</div></td>
</tr>
</table>
</div>
</div>
</div>
$(function() {
$('#compareTable tr').last().css('border', '0');
});
or
$(function() {
$('#compareTable tr:last-child').css('border', '0');
});
demo:
http://jsfiddle.net/edLev/
jQuery implements the :last
selector, so this should work:
$('#compareTable tr:last')
// or, for better performance
$('#compareTable tr').filter(':last')
Having said that, .eq(-1)
should work too...
EDIT: I just tried :last
and .eq(-1)
with your html and both worked fine in both Chrome and IE.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With