JS: Print content of div

index.html

<h2>JS: Print content of div</h2>

<div class="hidden">
  <div id="printDiv">
    <h3>This will be printed</h3>
  </div>
</div>

<div>
  <h3>This won't be printed</h3>
</div>

<button id="doPrint">Print</button>

js-print-content-of-div.markdown

JS: Print content of div

A method using JavaScript to only print the content of a specific div

A Pen by Martin on CodePen.

License.

script.js

document.getElementById("doPrint").addEventListener("click", function() {
     var printContents = document.getElementById('printDiv').innerHTML;
     var originalContents = document.body.innerHTML;
     document.body.innerHTML = printContents;
     window.print();
     document.body.innerHTML = originalContents;
});

style.css

.hidden {
  display:none;
}

body {
  background: #edfffe;
}