title: How to set images background of div element via setInterval?
body: <p>I implemented an iterator for my array, but I need to put <code>array[i]</code> as the background image of a div element. My iteration process completes but the background image is not working. Can any experts solve this?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//var imgobj = ['https://www.w3.org/html/logo/downloads/HTML5_Logo_512.png','https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTWOZVcvYs5dunAY_vSMxvFNKOvLWbn3RkHUM8SEU1cci9kNJEG','http://www.adservio.fr/img/logos2/jquery.jpg','https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcSKaIDe-P2BzZgWQLEOBo-LOTqduyPmBaRKhh0XcNG64fOTsm9e9A','http://www.unixstickers.com/image/data/stickers/python/python.sh.png'];
  
  var imgobj1 = ['IMG1', 'IMG2', 'IMG3', 'IMG4', 'IMG5'];
  var i = 0;
  
  function iterate() {
    setInterval(function() {
      $('.frame-div').html(imgobj1[i]);
      //$('.frame-div').css({'background',imgobj[i]});
      i++
    }, 2000);
  
  }
  $(document).ready(function() {
    iterate();
    setInterval(function() {
      i = 0;
    }, 10000);
  
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.frame-div {
    width: 300px;
    height: 300px;
    border: 1px solid #c1dbff;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="frame-div"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>