Jquery Selector Unable To Find Visible Last-child
Here is my HTML: &
Solution 1:
Try using .last()
selector:
Reduce the set of matched elements to the final one in the set.
$( "table#dataTable.xLookup thead#PickerTHEAD tr th:visible" ).last()
Because your last visible child is not last child in the DOM node.
var a = $( "table#dataTable.xLookup thead#PickerTHEAD tr th:visible" ).last();
console.log(a.html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="dataTable" class="xLookup">
<thead id="PickerTHEAD">
<tr>
<th class="xSelBox"> </th>
<th style="display: none">Option ID</th>
<th>My Description</th>
<th>QTY</th>
<th>Unit Price</th>
<th style="display: none">nj1</th>
<th style="display: none">nj2</th>
</tr>
<tr>
...
</tr>
</thead>
<tbody>
...
</tbody>
</table>
Solution 2:
You are using :last-child
Selector which selects all elements that are the last child of their parent.
You will need to use :last
Selector that selects the last matched element.
th = $("table#dataTable.xLookup thead#PickerTHEAD tr th:visible:last");
console.log(th.html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="dataTable" class="xLookup">
<thead id="PickerTHEAD">
<tr>
<th class="xSelBox"> </th>
<th style="display: none">Option ID</th>
<th>My Description</th>
<th>QTY</th>
<th>Unit Price</th>
<th style="display: none">nj1</th>
<th style="display: none">nj2</th>
</tr>
<tr>
...
</tr>
</thead>
<tbody>
...
</tbody>
</table>
Post a Comment for "Jquery Selector Unable To Find Visible Last-child"