javascript - Hide <td> when i click the print button -

now have print button.when click print button hide existing column content , show content.each column having different contents.

code

 <button class="btn" id="print"><i class="icon-print"></i>  print</button>   <div id="drop1" > <td><?php echo $detail->remarks;?></td>  </div>      <div id="drop2" > <td> <a href="#view_popup_descriptive_index" class="btn green" title="reason" data-toggle="modal" title="reason">reason <input name="app_id" id="appid" class="appid" type="hidden" value="<?php echo $detail->remarks;?>"/>   </a>  </td>  </div> 

script

  $("#print").on('click', function(){       document.getelementbyid('drop2').style.display = "none";     document.getelementbyid('drop1').style.display = "block";     window.print(); }) 

make use of media="print". stylesheet applied when want print page. can hide td's adding display:none.

<link rel="stylesheet" type="text/css" href="print.css" media="print"> 

http://www.w3schools.com/tags/att_link_media.asp