title: localStorage not working in IE9 and Firefox
body: <p>I am working with localStorage. My code is perfectly working in Chrome, but not in IE9 and Firefox.</p>
  
  <p>Here is the code:</p>
  
  <pre><code>document.addEventListener("DOMContentLoaded", restoreContents, false);
  document.getElementsByTagName("body")[0].onclick=function(){saveContents('myList','contentMain', event, this);};
  
  function amIclicked(e, eleObject)
  {
      alert("amIClicked");
      e = e || event;
      var target = e.target || e.srcElement;
      alert("target = " + target.id);
      if(target.id=='pageBody' || target.id=='Save')
          return true;
      else
          return false;
  }
  
  function saveContents(e, d, eveObj, eleObject) {
      //alert("saveContents");
      if (amIclicked(eveObj, eleObject)) {
          var cacheValue = document.getElementById(e).innerHTML;
          var cacheKey = "key_" + selectedKey;
          var storage = window.localStorage;
          //alert ("cacheKey = " + cacheKey + " ,cacheValue = " + cacheValue); 
          if(typeof(Storage)!=="undifined"){
          localStorage.setItem("cacheKey","cacheValue");
          }
          //alert ("Saved!!"); 
          var dd = document.getElementById(d);
          //document.getElementById("contentMain").style.display == "none";       
          dd.style.display = "none";
      }
  }
  
  function restoreContents(e,k) {
      //alert("test");
      if(k.length &lt; 1) { return; }
      var mySavedList = localStorage["key_" + k];
  
      if (mySavedList != undefined) {
          document.getElementById(e).innerHTML = mySavedList;
      }
  }
  
  
      &lt;a onclick="ShowContent('contentMain','myList','Sample_1'); return true;" href="#" &gt;Sample 1&lt;/a&gt;&lt;br/&gt;&lt;br/&gt;
      &lt;a onclick="ShowContent('contentMain','myList','Sample_2'); return true;" href="#" &gt;Sample 2&lt;/a&gt;&lt;br/&gt;&lt;br/&gt;
  
      &lt;div style="display:none;display:none;position:absolute;border-style: solid;background-color: white;padding: 5px;"id="contentMain"&gt;
      &lt;ol id="myList" contenteditable="true"&gt;
          &lt;li&gt;Enter Content here&lt;/li&gt;
      &lt;/ol&gt;
  &lt;!--&lt;input id="editToggleButton" type="button" value="Edit"/&gt;--&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>when I tried to debug the code in Firefox with Firebug, I am getting the error in different line. I am totally confused here :)</p>
  
  <p>Here is the code where I am getting the error:</p>
  
  <pre><code>function amIclicked(e, eleObject)
  {
      alert("amIClicked");
      e = e || event;
      var target = e.target || e.srcElement;
      alert("target = " + target.id);
      if(target.id == 'pageBody' || target.id == 'Save'){
          return true;
      }
      else{
          return false;
      }
  }
  </code></pre>
  
  <p>And the error I am getting in Mozilla Firefox is:</p>
  
  <pre><code> target is undefined
  [Break On This Error]   
  
  alert("target = " + target.id);
  </code></pre>
  
  <p>I have declared the target in </p>
  
  <pre><code>&lt;body id="pageBody"&gt;
  </code></pre>
  
  <p>too much confused</p>