"getContext is not a function" when using variable for element selector
<p>I have:</p>

<pre><code>&lt;div id="canvasContainer"&gt;
    &lt;canvas id="myCanvas" height="450" width="650"&gt;&lt;/canvas&gt;
&lt;/div&gt;
</code></pre>

<p>and:</p>

<pre><code>var myCanvas = $("#myCanvas");
var myCanvasContext = myCanvas.getContext("2d");
</code></pre>

<p>yet I get:</p>

<blockquote>
  <p>Uncaught TypeError: myCanvas.getContext is not a function</p>
</blockquote>

<p>when the page is loaded.</p>

<p>When I try something like:</p>

<pre><code>myCanvas.click (function() {
    console.log("You clicked the canvas");
});
</code></pre>

<p>the reference to <code>myCanvas</code> works perfectly. What gives?</p>