title: top.frames wont work in chrome
body: <p>I have 3 html pages. main.html, page1.html and page2.html. I am displaying page1.html and page2.html in main.html using following code.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
     &lt;frameset frameborder="1" rows="50%, *"&gt;
          &lt;frame name="f1" src="Page1.html" /&gt;
          &lt;frame name="f2" src="Page2.html"/&gt;
      &lt;/frameset&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>page1.html code</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html&gt;
     &lt;head&gt;
        &lt;style&gt;
               .content {display:none;}
        &lt;/style&gt;
        &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="myjs.js"&gt;&lt;/script&gt;
     &lt;/head&gt;
     &lt;body&gt;
           &lt;table id="resultDetails" border="1"&gt;
                 &lt;th&gt;Result Details&lt;/th&gt;
                 &lt;tr&gt;
                    &lt;td&gt;
                    Click on me to see more details in other page
                    &lt;div class="content"&gt;
                         &lt;p&gt; R1 data&lt;/p&gt;
                    &lt;/div&gt;
                    &lt;/td&gt;
  
                 &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And Page2.html code</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
     &lt;body&gt;
           &lt;div id="myDiv"&gt;
  
           &lt;/div&gt;
  
           &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="myjs.js"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My JavaScript myjs.js</p>
  
  <pre><code> $(document).ready(function () {
      $('table').on('click', 'tr', function () {
         var doc =window.top.frames['f2'].document;
         var divElmnt = $(doc.getElementById('myDiv'));
  
         $(divElmnt.html($(this).find('.content').html()));
      });
  });
  </code></pre>
  
  <p>With this code, on clicking on table row, i am able to display the div "content" content in "mydiv" div of page2.</p>
  
  <p>This works in IE and FF but wont work in Chrome. Error: doc is undefined.
  What is the equivalent for window.top.frames['f2'] for chrome.</p>