jquery simple cart example

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <div class="picker-image"></div>
    <hr>
    <div class="backgroundIMage"></div>
    <div id="front" style="height:200px;width:200px;border:1px solid #333">
    Front Side Image
    </div>
    <div id="back" style="height:200px;width:200px;border:1px solid #333">
    back Side Image
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="script.js"></script>
  </body>
</html>

// Code goes here
$(function() {
  var singleton = singleton ? singleton : {};
  singleton.bgArray = {
    data: [{
      "mainSrc": "https://d3s16h6oq3j5fb.cloudfront.net/1.13.0/img/new-city-home/bang-img/softtoys3.jpg",
      "backSrc": "http://www.humboldtmfg.com/product-images/H-2943.jpg",
      "frontSrc": "https://slm-assets1.secondlife.com/assets/4253197/view_large/Vendor%20cart%20Mesh_001.jpg?1315917724"
    }, {
      "mainSrc": "https://d2z4fd79oscvvx.cloudfront.net/0016630_quad_diamond_earings_205.jpeg",
      "backSrc": "https://www.piperonline.net/media/Custom_Radius-End_Coffee_Bar.jpg",
      "frontSrc": "https://www.piperonline.net/media/Floral_Supply_Cabinet.jpg"
    }, {
      "mainSrc": "https://d2z4fd79oscvvx.cloudfront.net/0020715_be_my_valentine_chocolate_box_205.jpeg",
      "backSrc": "https://www.piperonline.net/media/End_Cap_Merchandiser.jpg",
      "frontSrc": "https://www.piperonline.net/media/Low_Tiered_Corner_Wedge.jpg"
    }]
  };
  singleton.initApp = function() {
    this.generateBgImages();
    $("#front").css({
      'background-image': 'url(' + singleton.bgArray.data[0].frontSrc + ')'
    });
    $("#back").css({
      'background-image': 'url(' + singleton.bgArray.data[0].backSrc + ')'
    });
    $(".picker-image").on("click", "img", function() {
      console.log($(this).attr('data-id'));
      var tempRefObj = singleton.bgArray.data[$(this).attr('data-id')];
      $("#front").css({
        'background-image': 'url(' + tempRefObj.frontSrc + ')'
      });
      $("#back").css({
        'background-image': 'url(' + tempRefObj.backSrc + ')'
      });
    });
  };
  singleton.generateBgImages = function() {
    this.bgArray.data.forEach(function(src,index) {
      var img = new Image(50, 50);
      img.setAttribute('data-id',index);
      img.src = src.mainSrc;
      $(".picker-image").append(img);
    });
  }
  singleton.initApp();
});

/* Styles go here */