Print using Jquery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
var htmlContentPrint="";
$(document).ready(function(){
$("#btnPrint").click(function () {
var divPrint = document.getElementById('modelBox');
var tableElements = $(divPrint).find('.ui.table');
$(tableElements).each(function (i) {
$($(tableElements)[i]).attr('style', 'width:100%');
$($(tableElements)[i]).attr('border', '1');
});
var newWindow = window.open('', 'Print-Window');
newWindow.document.open();
htmlContentPrint = '<html><head>'+
'<link type="text/css" media="print,screen" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.11/semantic.min.css"></link></head><body onload="window.print()">' + divPrint.innerHTML + '</body></html>';
newWindow.document.write(htmlContentPrint);
newWindow.document.close();
setTimeout(function () { newWindow.close(); }, 10);
});
});
</script>
<input id="btnPrint" type="button" value="Print" />
<div id="modelBox">
<table class="ui table">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td>
<td>Doe</td>
<td>john@example.com</td>
</tr>
<tr>
<td>Mary</td>
<td>Moe</td>
<td>mary@example.com</td>
</tr>
<tr>
<td>July</td>
<td>Dooley</td>
<td>july@example.com</td>
</tr>
</tbody>
</table>
</div>
