title: HTML 5 Canvas and QR Code
body: <p>I'm using this repository <a href="https://github.com/jeromeetienne/jquery-qrcode" rel="nofollow noreferrer">qrcode</a> to generate QR codes</p>
  
  <p>This is my Jquery</p>
  
  <pre><code>    $(".generatetext").click(function() {
          var x = document.getElementById("textdata").value;
          $('#output').qrcode(x);
      });
  </code></pre>
  
  <p>so this gets the input value of the user and generates the QR code on click on a button.
  but every time I click "Generate Button" it generates a new QR code in a new line, doesn't replace the existing one.</p>
  
  <pre><code>&lt;canvas width="256" height="256"&gt;&lt;/canvas&gt;-&gt; on first click
  &lt;canvas width="256" height="256"&gt;&lt;/canvas&gt;-&gt; on second click
  &lt;canvas width="256" height="256"&gt;&lt;/canvas&gt;-&gt; on third click
  </code></pre>
  
  <p><a href="http://www.textalter.com/qr-code-generator/" rel="nofollow noreferrer">DEMO</a> -&lt;- generate 2 or 3 qr codes</p>
  
  <p>it creates a list of QR codes. how do I solve this problem?
  I want just one QR code to be shown every time I click on Generate button</p>