Uncaught TypeError: getElementsByName is not a function
<p>I have a bunch of elements on a page that are formatted like below:</p>

<pre><code>&lt;div class="longdesc"&gt;
 &lt;pre style="..."&gt;
   //stuff here
 &lt;/pre&gt;
&lt;/div&gt;
&lt;div class="longdesc"&gt;
 &lt;pre style="..."&gt;
   //stuff here
 &lt;/pre&gt;
&lt;/div&gt;
</code></pre>

<p>I'm trying to replace some of the content inside the <code>&lt;pre&gt;</code> tag but I'm having trouble.  </p>

<pre><code>(function () {    
    var nodes = document.getElementsByClassName("longdesc");
    for (var n=0; n&lt;nodes.length; n++) {
        var node = nodes[n].getElementsByName("pre");
        node[0].textContent = node[0].textContent.replace("&lt;", "&amp;lt;");
        //other code
    }
})();
</code></pre>

<blockquote>
  <p>VM5185:4 Uncaught TypeError: nodes[n].getElementsByName is not a
  function</p>
</blockquote>

<p>I only need the first <code>pre</code> in each <code>longdesc</code>.  How can I do this?</p>