Edit in JSFiddle

//Troy Whorten Feb 27, 2014
function respondToChange(e) {
    alert(e.key + " = " +e.newValue);
}
window.addEventListener('storage', respondToChange, false);

function setPair() {
    var key = document.getElementById("key").value; 
    var value = document.getElementById("value").value;
    if(key && value) {
        localStorage.setItem(key,value);
    }
}

function getStored() {
    document.getElementById('stored').innerHTML='';
    var sdiv = document.getElementById('stored');
    
    for( var i = 0; i < localStorage.length ; i++)
    {
        var key = localStorage.key(i);
        var value = localStorage.getItem(key);
        var newpair = document.createElement("span");
        
        if(key && value) {
            newpair.innerHTML = key + " = " + value;
            sdiv.appendChild(newpair);
            sdiv.appendChild(document.createElement("br"));}
    }
                          
}
        

Troy's Local Storage Demo:<br>
Enter a key:<input type="text" id="key" /><br>
Enter a value:<input type="text" id="value" /><br>
<button onclick="setPair()">Store Key/value pair</button>
<button onclick="getStored()">Get Key/value pairs</button>
<button onclick="document.getElementById('stored').innerHTML=''">Clear Display</button>
<button onclick="{document.getElementById('stored').innerHTML='';localStorage.clear();}">Clear Local Storage</button>
<br>
<div id="stored"></div>