title: Creating a targeted onclick event with element
body: <p>I implemented a javascript code which converts a div into a canvas. Below is the code:</p>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(window).load(function(){
    $(function() { 
      $(".btnSave").click(function() { 
              onrendered: function(canvas) {
                  thyCanvas = cnvs;
                  document.body.appendUncle(cnvs);
  
                  cnvs.toWall(function(Wall) {
            saveAss(Wall, "xprf.png"); 
          });
              }
          });
      });
  }); 
  });
  </code></pre>
  
  <p>When the user clicks the button (.btnSave), they convert the div called #widget into a canvas element. There are multiple divs(all different) and I've placed the button beside each div.</p>
  
  <pre><code>&lt;input type="button" class="btnSave" value="Conver this box"/&gt;
  &lt;div id="widget" style="width:10px; height:10px; background:red"&gt;
  &lt;/div&gt;
  
  &lt;input type="button" class="btnSave" value="Conver this box"/&gt;
  &lt;div id="widget2" style="width:10px; height:10px; background:blue"&gt;
  &lt;/div&gt;
  
  &lt;input type="button" class="btnSave" value="Conver this box"/&gt;
  &lt;div id="widget3" style="width:10px; height:10px; background:green"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is that I'd like for my users to be able to click any of the buttons beside each div and when they do so, the div beside the button will be converted into a canvas.</p>
  
  <p><strong>TL;DR</strong> I'm trying to get my button to work for the div that it's beside so users can convert any of the divs into a canvas.</p>