title: JavasScript function undefined
body: <p>i've got an html element declared as so:</p>
  
  <pre><code>&lt;div id="taskImage" runat="server"&gt;
     &lt;a href="javascript:void(0);" onclick="switchViews('div&lt;%# Eval("proId") %&gt;', 'one');"&gt;
        &lt;img id='imgdiv&lt;%# Eval("proId") %&gt;' alt="Click to show/hide tasks" border="0" src="..."/&gt;
     &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the javascript function switchViews is declared post-html as such:</p>
  
  <pre><code>function switchViews(obj, row) {
  
        var div = document.getElementById(obj);
      var img = document.getElementById('img' + obj);
  
      if (div.style.display == "none") {
          div.style.display = "inline";
  
          img.src = "../../images/icons/delete.png";
  
      }
      else {
          div.style.display = "none";
  
          img.src = "../../images/icons/add.png";
  
      }
  
  }
  </code></pre>
  
  <p>when I click on the html element, i get thrown a JS error saying "Object Exepcted", and in the google chrome script debugger it says that switchViews is undefined.  Why would it think that switchViews is undefined and how would I go about fixing it?  For the record I have tried it with the javascript declared before the html and with the switchViews call in the href attribute but it all ends the same.</p>
  
  <p><strong>EDIT :</strong> to clear something up, by post-html and pre-html i mean before and after i write out the html elements.  so post would be like</p>
  
  <pre><code>&lt;div&gt;
     &lt;!-- All my html stuff --&gt;
  &lt;div&gt;
  &lt;script type="text/javascript"&gt;
     &lt;!-- All my Javascript --&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>and pre would be the reverse of that</p>