title: Undefined for chrome.storage.sync.get?
body: <p>In my content script, I set a a couple <code>chrome.storage</code> values, and in my popup script, I read and get those values. </p>
  
  <p>I've tried everything, but it keeps returning "undefined" which doesn't make sense because the value is certainly not undefined.</p>
  
  <p><strong>My content.js script</strong>:</p>
  
  <pre><code>imgs=["test.png","othertest.png"]
  
  for (i = 0; i &lt; imgs.length; i++){
      var key = "image"+i
      var value = imgs[i]
      chrome.storage.sync.set({key: value}, function() {
        console.log('Value is set to ' + value + ' and key is set to '+key);
      })
  }
  chrome.storage.sync.set({"count": imgs.length}, function() {
        console.log('Saved count value. Current count: '+imgs.length)
  });
  </code></pre>
  
  <p><strong>My popup.js script</strong>:</p>
  
  <pre><code>document.addEventListener('DOMContentLoaded',function(){
      chrome.storage.sync.get(['count'], function(result) {
          console.log(result.value)
          for (i = 0; i &lt; result.value; i++){
              chrome.storage.sync.get(['image'+i], function(result) {
                  var img = document.createElement("img")
                  img.src = result.value
                  document.body.appendChild(img)
              })
          }
      })
  })
  </code></pre>
  
  <p><strong>My popup.html file</strong>:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
        &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;title&gt;Untitled Document&lt;/title&gt;
        &lt;/head&gt;
  
        &lt;body&gt;
          &lt;h1&gt;Images&lt;/h1&gt;
          &lt;script src="popup.js"&gt;&lt;/script&gt;
        &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The <code>popup.js</code> script is supposed to get every image from chrome.storage and display them on the popup. Any help would be greatly appreciated. </p>