Question

I have the code below. The purpose of the code is to grab all the values stored in the local storage and display them in two HTML elements with ids of 'title' and 'textLoc'. 'title' is an <input type="text"> and 'textLoc' is a <textarea>. I want the values to be stored in the <textarea> and the keys to be stored in the <input type="text">. The values are being stored correctly but the keys are not. Any ideas on why this would be?

var tests = [];
var titles = [];

var finalTests = "";

var key, value;
for (var i = 0; i < localStorage.length; i++) {
  key = localStorage.key(i);
  value = localStorage.getItem(key);
  tests.push(value);
  titles.push(key);
  finalTests += "<tr><td><a class=\"dashlinks\" href=\"javascript:void\" onclick=\"rememberTest("+i+")\">" + key + "</a></td></tr>";
}

for (i=0; i<tests.length; i++) {
document.getElementById('title').innerHTML = titles[i];

document.getElementById('textLoc').innerHTML = tests[i];
}

Answer 1

You should use document.getElementById('title').value and document.getElementById('textLoc').value. Also it seems like you are doing nothing with finalTests after you store it.