JSFiddle - React, Tailwind, and code Playground

HTML

<div class="PrintMessage">You are not authorized to print this document</div>
<div id="AllContent">
    <div>You won't see anything when printing</div>
    <div>You won't see anything when printing</div>
    <div>You won't see anything when printing</div>
    <div>You won't see anything when printing</div>
    <div>You won't see anything when printing</div>
</div>

CSS

.PrintMessage { display: none; }

JavaScript

if ('matchMedia' in window) {
    // Chrome, Firefox, and IE 10 support mediaMatch listeners
    window.matchMedia('print').addListener(function(media) {
        if (media.matches) {
            beforePrint();
        } else {
            // Fires immediately, so wait for the first mouse movement
            $(document).one('mouseover', afterPrint);
        }
    });
} else {
    // IE and Firefox fire before/after events
    $(window).on('beforeprint', beforePrint);
    $(window).on('afterprint', afterPrint);
}

function beforePrint() {
    $("#AllContent").hide();
    $(".PrintMessage").show();
}

function afterPrint() {
    $(".PrintMessage").hide();
    $("#AllContent").show();
}