JSFiddle - React, Tailwind, and code Playground

by Dave Salomon

HTML

<div id="Foo">
    <p>Lorem Ipsum....</p>
</div>
<div id="Bar">
    <p>Dolor sit amet...</p>
</div>
<div id="Baz">
    <p>Boop boop!</p>
</div>

<button id="b1">Print1</button>
<button id="b2">Print2</button>

JavaScript

$.fn.print = function(){
    var content = $(this).html();
    var w = window.open('about:blank','', 'width=800,height=600,top=100,left=100');
    w.document.write(content);
    w.print();
    w.close();
};

$.fn.print2 = function(){
    $('*').not(this).addClass('hidden-for-print').hide();
    $(this).children().removeClass('hidden-for-print').show();
    $(this).parents().removeClass('hidden-for-print').show();
    window.print();
    $('.hidden-for-print').show();
};

$('#b1').click(function(){
$('#Bar').print();
});
$('#b2').click(function(){
$('#Bar').print2();
});