Cannot read property 'value' of undefined?
<p>To learn JavaScript I am writing a small text editor Google Chrome extension. But I keep getting this error: <code>Cannot read property 'value' of undefined</code>. It happens whenever <code>tranquility.save();</code> is called, but not when <code>tranquility.open();</code> which is weird because they are basically the same, just switched the sides. <code>paper</code> is just a <code>&lt;textarea&gt;</code>.</p>

<pre><code>var tranquility = {
 paper: document.getElementById("paper"),
 lastOpenedPaper: localStorage.getItem("lastOpenedPaper"),

 listen: function() {
    this.paper.addEventListener("keyup", this.save, false);
 },

 save: function() {
    localStorage.setItem(this.lastOpenedPaper, this.paper.value);
 },

 open: function() {
    this.paper.value = localStorage.getItem(this.lastOpenedPaper);
 }
}
</code></pre>

<p><strong>EDIT:</strong></p>

<p>It is called after <code>&lt;textarea&gt;</code> is created (unless it has to be the entire DOM)</p>

<pre><code>&lt;body&gt;
    &lt;textarea id="paper"&gt;&lt;/textarea&gt;
    &lt;script src="../js/application.js"&gt;&lt;/script&gt;
    &lt;script&gt;
        tranquility.listen();
    &lt;/script&gt;
&lt;/body&gt;
</code></pre>
