Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to target last tr in jquery?

Tags:

html

jquery

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>
like image 795
Jitender Avatar asked Mar 14 '12 08:03

Jitender


2 Answers

$(function() {
  $('#compareTable tr').last().css('border', '0');
});

or

$(function() {
  $('#compareTable tr:last-child').css('border', '0');
});

demo:

http://jsfiddle.net/edLev/

like image 148
Yoshi Avatar answered Sep 28 '22 12:09

Yoshi


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.

like image 28
nnnnnn Avatar answered Sep 28 '22 12:09

nnnnnn