Skip to content Skip to sidebar Skip to footer

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());
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><tableid="dataTable"class="xLookup"><theadid="PickerTHEAD"><tr><thclass="xSelBox">&nbsp;</th><thstyle="display: none">Option ID</th><th>My Description</th><th>QTY</th><th>Unit Price</th><thstyle="display: none">nj1</th><thstyle="display: none">nj2</th></tr><tr>
         ...
      </tr></thead><tbody>
      ...
   </tbody></table>

Solution 2:

You are using :last-childSelector which selects all elements that are the last child of their parent.

You will need to use :lastSelector that selects the last matched element.

th = $("table#dataTable.xLookup thead#PickerTHEAD tr th:visible:last");

console.log(th.html());
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><tableid="dataTable"class="xLookup"><theadid="PickerTHEAD"><tr><thclass="xSelBox">&nbsp;</th><thstyle="display: none">Option ID</th><th>My Description</th><th>QTY</th><th>Unit Price</th><thstyle="display: none">nj1</th><thstyle="display: none">nj2</th></tr><tr>
      ...
    </tr></thead><tbody>
    ...
  </tbody></table>

Post a Comment for "Jquery Selector Unable To Find Visible Last-child"