JSFiddle - React, Tailwind, and code Playground
HTML
<div id="footer">
This will be printed. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a quam at nibh adipiscing interdum. Nulla vitae accumsan ante.
</div>
<div>
This will not be printed.
</div>
<div id="anotherdiv">
Nor will this.
</div>
<input type="button" value="Print Div" onclick="PrintElem('#footer')" />
CSS
#footer{
clear: left;
width: 100%;
height: 100px;
margin: 0;
margin-top: 1em;
position: relative;
background: #69a148;
background: rgb(87,122,55);
background: -moz-radial-gradient(center, ellipse cover, rgba(87,122,55,1) 0%, rgba(105,161,72,1) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(87,122,55,1)), color-stop(100%,rgba(105,161,72,1)));
background: -webkit-radial-gradient(center, ellipse cover, rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: -o-radial-gradient(center, ellipse cover, rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: -ms-radial-gradient(center, ellipse cover, rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: radial-gradient(ellipse at center, rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#577a37', endColorstr='#69a148',GradientType=1 );
color: #eee;
text-align: center;
padding: 0;
}
JavaScript
function PrintElem(elem)
{
Popup($('<div/>').append($(elem).clone()).html());
}
function Popup(data)
{
alert(data);
var mywindow = window.open('', 'my div', 'height=400,width=600');
//mywindow.document.write('<html><head><title>my div</title>');
// mywindow.document.write('<link rel="stylesheet" href="http://www.dynamicdrive.com/ddincludes/mainstyle.css" type="text/css" />');
//mywindow.document.write('</head><body >');
mywindow.document.write(data);
//mywindow.document.write('</body></html>');
mywindow.print();
mywindow.close();
return true;
}