javascript - How to delete the last column in an HTML TABLE using by jquery? -

i have html table:

<table id="persons" border="1">     <thead id="theadid">         <tr>             <th>name</th>             <th>sex</th>             <th>message</th>         </tr>     </thead>     <tbody id="tbodyid">         <tr>             <td>viktor</td>             <td>male</td>             <td>etc</td>         </tr>         <tr>             <td>melissa</td>             <td>female</td>             <td>etc</td>         </tr>         <tr>             <td>joe</td>             <td>male</td>             <td>etc</td>         </tr>     </tbody> </table> <input type="button" onclick="deletelastcolumn();" value="do it"/> 

i need javascript/jquery code, delete last column (message) in table:

function deletelastcolumn() {     $("#theadid tr th:not(:last-child)......     $("#tbodyid tr td:not(:last-child)...... } 

so result should this:

<table id="persons" border="1">     <thead id="theadid">         <tr>             <th>name</th>             <th>sex</th>         </tr>     </thead>     <tbody id="tbodyid">         <tr>             <td>viktor</td>             <td>male</td>         </tr>         <tr>             <td>melissa</td>             <td>female</td>         </tr>         <tr>             <td>joe</td>             <td>male</td>         </tr>     </tbody> </table> 

i know there ":not(last)" method, can't find example problem. me?

try

$('#persons tr').find('th:last-child, td:last-child').remove() 

demo: fiddle