title: Javascript calling a class function
body: <p>I'm trying to call a class function:</p>
  
  <pre><code>// Gantt chart object
  function ganttChart(gContainerID) {
  
      this.isDebugMode = true;                                    // Is this chart in debug mode
      this.gContainer = document.getElementById(gContainerID);    // The container the chart is built inside
      this.gDebugPannel;                                          // Debug pannel
  
      // Create debug pannel
      if (this.isDebugMode) {
          this.gContainer.innerHTML += "&lt;div id=\"gDebug" + gContainerID + "\" class=\"gDebug\"&gt;cometishian&lt;/div&gt;";
          this.gDebugPannel = document.getElementById("gDebug" + gContainerID);
      }
  
      gDebug("lmfao!");
  
  // Updates debug information
  function gDebug(debugMessage) {
      alert(this.gDebugPannel.innerHTML);
      if (this.isDebugMode) { this.gDebugPannel.innerHTML = debugMessage; }
  }
  }
  </code></pre>
  
  <p>I expect it to alert "cometishian" but <code>this.gDebugPannel.innerHTML</code> is null, any ideas?</p>
  
  <p>Upon further investigation this.gDebugPannel is undefined.</p>
  
  <p>Update:</p>
  
  <pre><code>// Gantt chart object
  function ganttChart(gContainerID) {
  
      this.isDebugMode = true;                                    // Is this chart in debug mode
      this.gContainer = document.getElementById(gContainerID);    // The container the chart is built inside
      this.gDebugPannel;                                          // Debug pannel
      this.gPosX;
      this.gPosY;
  
      // Create debug pannel
      if (this.isDebugMode) {
          this.gContainer.innerHTML += "&lt;div id=\"gDebug" + gContainerID + "\" class=\"gDebug\"&gt;5,5 | 5.1&lt;/div&gt;";
          this.gDebugPannel = document.getElementById("gDebug" + gContainerID);
      }
  
      // Updates debug information
      ganttChart.gDebug = function(debugMessage) {
          if (this.isDebugMode) { this.gDebugPannel.innerHTML = debugMessage; }
      }
  
      this.gDebug("wo");
  
  }
  </code></pre>
  
  <p>the line this.gDebug("wo") throws:</p>
  
  <p>Webpage error details</p>
  
  <p>User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; InfoPath.1; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 1.1.4322; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; OfficeLiveConnector.1.4; OfficeLivePatch.1.3)
  Timestamp: Thu, 25 Nov 2010 12:57:51 UTC</p>
  
  <pre><code>Message: Object doesn't support this property or method
  Line: 21
  Char: 5
  Code: 0
  URI: http://server1/bb/ganttnew/gMain.js
  </code></pre>