title: Add Image to canvas through Jquery
body: <p>I'm trying to add an image to an Canvas element. Canvas markup:</p>
  
  <pre><code>&lt;?php foreach($fdsArray as $key =&gt; $value):?&gt;
     &lt;div class="design" id="&lt;?php echo $key;?&gt;" data-design="&lt;?php echo $value['url'];?&gt;"&gt;
        &lt;canvas width="200" height="200"&gt;&lt;/canvas&gt;
        &lt;p class="name"&gt;&lt;?php echo $value['name'];?&gt;&lt;/p&gt;
        &lt;p class="asset"&gt;&lt;?php echo $value['asset'];?&gt;&lt;/p&gt;
     &lt;/div&gt;
  &lt;?php endforeach;?&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function() {
         $('.design').each(function() {
              var design = $(this).attr('data-design');
              var id = $(this).attr('id');
         });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I want the image to show inside the canvas element. var design contains the url. Could anyone help me out?</p>