Getting key and vaue from local Storage and displaying using js : 

i am not getting values getting only keys.
i want take key and values from local storage and display 
in the paragraph while generating the paragraph dynamically
using java script .

    `<body>
       <p id="para1"></p>
       <p id="para2"></p>
    </body>
    <script>
    
    for(var i=0, len=localStorage.length; i<len; i++)
    {
   
     var p1= document.getElementById("para1");
    var para = document.createElement("P");
      var key = document.createTextNode(localStorage.key(0));
      para.appendChild(key);
      p1.appendChild(para);
        console.log("key");

      var p2= document.getElementById("para2");
      var para2 = document.createElement("P");
      var value = document.createTextNode(localStorage.getitem(key));
     
      para2.appendChild(value);
      p2.appendChild(para);
      console.log("value");
     
    }
    </script>`