title: "this.innerHTML" returns "undefined" while inspecting "this" DOM properties shows a content
body: <p>I found a lot of (partly) similar posts on SO, but they all involve pretty obvious errors, generally because the given <code>this</code> is not what they believe at the time they ask for <code>this.innerHTML</code>.</p>
  
  <p>But here I face a situation where execution is paused (with Firefox debugger) on a breakpoint on the statement involving <code>this.innerHTML</code>, and simultaneously:</p>
  
  <ul>
  <li>striking <code>this.innerHTML</code> in the console returns <code>undefined</code></li>
  <li>but the <code>this</code> DOM properties shows `innerHTML: "...some text..."</li>
  </ul>
  
  <p>The latter matches what I'd expect, since the current <code>this</code> is a simple element <code>&lt;span class="summary"&gt;...some text...&lt;/span&gt;</code>.<br>
  So I wonder how <code>this.innerHTML</code> can return <code>undefined</code> here.</p>
  
  <p>Another way to illustrate the contradiction, compare these two responses from the console:</p>
  
  <ul>
  <li><code>this.innerHTML</code> -> <code>undefined</code></li>
  <li><code>$(this)[0].innerHTML</code> -> <code>"...some text..."</code></li>
  </ul>
  
  <p>I hope I'm simply (and dumbly) missing something obvious.</p>
  
  <hr>
  
  <p>EDIT: I tried to present an excerpt of the involved code.</p>
  
  <p>Here is the schematized most interesting part:</p>
  
  <pre><code>$(document).ready(function() {
    // ...some stuff
    $('html').each(renderElement); // &lt;-- here is the main call
    // ...some stuff
  }
  
  function renderElement() { // &lt;-- the involved function
    if (this.innerHTML.match(/^\s*\[multi\]/)) { // &lt;-- the this.innerHTML point
      this.innerHTML = renderString(this.innerHTML);
      return;
    }
  
    // Otherwise recursively explore each node
    $(this).contents().each(function() {
      switch (this.nodeType) {
        case Node.TEXT_NODE:
          // ...some stuff
          break;
        case Node.ELEMENT_NODE:
          // ...some stuff
          renderElement.call(this); // &lt;-- here is the alternate (recursive) call
          break;
        default:
          // Do nothing for any other nodeType.
      }
    });
  }
  </code></pre>
  
  <p>NOTE: when the issue happens, necessarily the <code>renderElement</code> function has been called through the alternate call (since the involved <code>&lt;span&gt;</code> is not part of the 1st level elements).</p>