title: Greasemonkey: Adding print button - print and 'print friendly' style div
body: <p>I have created a greasemonkey script for the purpose of:</p>
  
  <ul>
  <li>Add print receipt button to 3rd party web app page</li>
  <li>Add receipt printer friendly styles to div in new window</li>
  <li>print this window</li>
  </ul>
  
  <p>The button shows up, but it doesn't trigger my function, which at this point just prints the div.</p>
  
  <p>Here's where I'm at:</p>
  
  <pre><code>var scriptElement = document.createElement('script');
  scriptElement.type = 'text/javascript';
  
  scriptElement.innerHTML =  'function printReceipt() { \
  var divToPrint=document.getEelementById("loanTable"); \
  newWin= window.open(""); \
  newWin.document.write(divToPrint.outerHTML); \
  newWin.print(); \
  newWin.close(); \
  }';
  
  document.getElementsByTagName("head")[0].appendChild(scriptElement);
  
  window.addButton = function () {
      // Get the location on the page where you want to create the button
      var targetDiv = document.getElementById('newcheckout');
  
      // Create a div to surround the button
      var newDiv = document.createElement('div');
      newDiv.setAttribute('id', 'autoCheckOrder');
  
      // Create the button and set its attributes
      var inputButton = document.createElement('input');
      inputButton.name = 'autoCheckOrderButton';
      inputButton.type = 'button';
      inputButton.value = 'Print Receipt?';
      inputButton.setAttribute("onclick", "printReceipt();");
  
      // Append the button to the div
      newDiv.appendChild(inputButton); 
      targetDiv.appendChild(newDiv);
  }
  addButton();
  </code></pre>