Change font family and font size to print

Question

this is my Javascript

<script type="text/javascript">
            function printInfo(ele) {
              var openWindow = window.open();
              openWindow.document.write(ele.previousSibling.innerHTML,'');
              openWindow.document.body.setAttribute('style', 'font-family:Arial !important;');
              openWindow.document.body.setAttribute('style', 'font-size:36px;');
              openWindow.document.close();
              openWindow.focus();
              openWindow.print();
              openWindow.close();
            }
          </script>

It change font family in my document except text in my table. please help. I print using:

open div-document-close div-a onclick printInfo(this)

<table border="0" style="margin-left: 10px;">
  <tr style="margin: 0px;">
     <td>Nama</td>
     <td style="padding:0 10px 0 10px">:</td>
     <td><?php echo "$nmlengkap";?></td>
  </tr>
</table>

Answer 1

Give the table an id so that you can set the styles on the table as well

<script type="text/javascript">
            function printInfo(ele) {
              var openWindow = window.open();
              openWindow.document.write(ele.previousSibling.innerHTML,'');
              tbl = openWindow.document.getElementById("tbl");
              tbl.setAttribute('style', 'font-family:Arial !important;');
              tbl.setAttribute('style', 'font-family:Arial 'font-size:36px;');
              openWindow.document.body.setAttribute('style', 'font-family:Arial !important;');
              openWindow.document.body.setAttribute('style', 'font-size:36px;');
              openWindow.document.close();
              openWindow.focus();
              openWindow.print();
              openWindow.close();
            }
          </script>

And the table:

<table id='tbl' border="0" style="margin-left: 10px;">
  <tr style="margin: 0px;">
     <td>Nama</td>
     <td style="padding:0 10px 0 10px">:</td>
     <td><?php echo "$nmlengkap";?></td>
  </tr>
</table>