title: Multiple Dynamic Canvas Elements?
body: <p>I have some code dynamically generating canvas elements from images using jquery and want to apply a single drawing context to each and all of these elements using document.getElementsByName or a similar method, is this possible? Here's my code so far:</p>
  
  <pre><code>$('#imagebox img').each(function(){
  
        var width = $(this).width();
        var height = $(this).height();
  
          $('&lt;canvas/&gt;', {
          name: 'canv',
          css: {
            margin: '0px',
            background: '#FF0000',
            float: 'left',
            width: width,
            height: height
          }
        }).appendTo('#main'); 
  
            // Get the canvas element and its drawing context
          var canvas = document.getElementsByName('canv');
          var context = canvas.getContext('2d');
  
          /*
          |---------------------
          | Origin: Top Left
          | End: Bottom Right
          |---------------------
          */
  
          context.beginPath();
          context.moveTo(0, 0);
          context.lineTo(canvas.width, canvas.height);
          context.stroke();
  
          /*
          |---------------------
          | Origin: Top Right
          | End: Bottom Left
          |---------------------
          */
  
          context.save();
          context.beginPath();
          context.moveTo(canvas.width, 0);
          context.lineTo(0, canvas.height);
          context.stroke();
          context.restore();
  
      });
  </code></pre>