Question 36803 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Remove class from table th – Jquery

I want to remove class "sorting" from the last <th> element of given datatable table.

<th class="sorting" tabindex="0" aria-controls="GetLibraryTable" rowspan="1" colspan="1" style="width: 108.009px;" aria-label="Action: activate to sort column ascending">Action</th>

I tried with below code:

document.querySelector("#GetLibraryTable_wrapper > div.dataTables_scroll > div.dataTables_scrollHead > div > table > thead > tr > th:nth-child(7)").removeClass('sorting');

But this gives below console error:

Uncaught TypeError: document.querySelector(…).removeClass is not a function

Tags:

3

Answers


  1. 0

    the jQuery solution is:

    $("#GetLibraryTable_wrapper > div.dataTables_scroll > div.dataTables_scrollHead > div > table > thead > tr > th:nth-child(7)").removeClass('sorting');

    no jQuery plain Javascript:

    document.querySelector("#GetLibraryTable_wrapper > div.dataTables_scroll > div.dataTables_scrollHead > div > table > thead > tr > th:nth-child(7)").classList.remove('sorting');

    for better selector use :last-of-type

    document.querySelector("#GetLibraryTable_wrapper th:last-of-type").classList.remove('sorting');
    Login or Signup to reply.
  2. 0 
    $( "th" ).last().removeClass('sorting');
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="mytable">
  <tr>
    <th class="sorting" tabindex="0" aria-controls="GetLibraryTable" rowspan="1" colspan="1" style="width: 108.009px;" aria-label="Action: activate to sort column ascending">Id</th>
    <th class="sorting" tabindex="0" aria-controls="GetLibraryTable" rowspan="1" colspan="1" style="width: 108.009px;" aria-label="Action: activate to sort column ascending">Action</th>
  </tr>
</table>
    Login or Signup to reply.
  3. 0

    I want to remove class "sorting" from the last element of given datatable table

    To achieve your requirement, you can try this code snippet using :last-child selector:

    document.querySelector("#GetLibraryTable_wrapper > div.dataTables_scroll > div.dataTables_scrollHead > div > table > thead > tr > th:last-child").classList.remove("sorting");

    More information about css selectors, can refer this doc: https://www.w3schools.com/cssref/css_selectors.asp

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search