javascript - jQuery: Hide tr of child td that contains ul + print? -

i have <table> <td> contain <ul> , want when specific button clicked, 2 things occur:

1. parent <tr> of children <td> contain <ul> hidden
2. the window printed after step 1 executed, <tr> containing <ul> hidden on printed sheet

http://jsfiddle.net/emturano/s9ywl/

html:

<table id="todo-list">     <tr>         <td>entry no ul 1</td>     </tr>     <tr>         <td>entry no ul 2</td>     </tr>     <tr>         <td>             <ul>i should hidden when printed</ul>         </td>     </tr>     <tr>         <td>entry no ul 4</td>     </tr> </table><p> 

click print

jquery:

function () {     $('#followup_a').click(followup); });  function followup() {     $('#todo-list tr:has(td:has(ul))').hide();     window.print(); } 

first problem see line function () {. improper syntax. think mean document ready method of i'll show in answer.

remove onclick="window.print()" link , change js following:

$(function(){ // document . ready call     $('#followup_a').on("click", function(e) {         //  if href not contain `javascript:void(0)` use         //  e.preventdefault(); // prevent default link action         $("#todo-list tr").filter(function(i) { return $(this).find("> td ul").length > 0 }).hide();         window.print();     }); }) 

what does:

• .filter() nice jquery method allows call on group of jquery elements $("#todo-list tr"), return table rows, , filter result object down based on information returns true.
  • although $('#todo-list tr:has(td:has(ul))') should same thing
• href="javascript:void(0)" 1 way prevent default link action, or, within click event call on event.preventdefault()

could written as:

function followup(e) {     $("#todo-list tr").filter(function(i) { return $(this).find("> td ul").length > 0 }).hide();     window.print(); }  $(function(){ // document . ready call     $('#followup_a').on("click", followup); }) 

demo