title: Replace img src with data-img
body: <p>I Found this solution and it's works, but this require TweenLite.js. 
  <br>It there any way to be working without TweenLite? and Compressing the code?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$.fn.loadImg = function() {
      return this.each(function() {
        var t = $(this),
          e = t.data(),
          i = e.img;
        if (e.insert) {} else {
          var r = {
            backgroundImage: "url(" + i + ")"
          };
          TweenLite.set(t, r);
        }
      }), this;
  }, (jQuery),
  $(function() {
      $("[data-img]").loadImg();
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>Can anyone kindly tell me what wrong is with the following code, images are not displayed!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('figure data-img').each(function() {
    this.src = $(this).data('src');
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;figure data-img="photo1.jpg"&gt;  &lt;/figure&gt;
  &lt;figure data-img="photo2.jpg"&gt;  &lt;/figure&gt;
  &lt;figure data-img="photo3.jpg"&gt;  &lt;/figure&gt;</code></pre>
  </div>
  </div>
  </p>