Loading iframes by clicking a div with nested divs
<p>I have a setof divs with nested items</p>

<pre><code>&lt;div id="second-item" class="dock-item"&gt;
  &lt;div class="website-name"&gt;Facebook.com&lt;/div&gt;
  &lt;div class="website-screenshot"&gt;&lt;img src="fb-thumb.png" /&gt;&lt;/div&gt;
  &lt;div class="page-name"&gt;Facebook&lt;/div&gt;
&lt;/div&gt;
    &lt;div id="third-item" class="dock-item"&gt;
  &lt;div class="website-name"&gt;Mozilla.com&lt;/div&gt;
  &lt;div class="website-screenshot"&gt;&lt;img src="uwdt-thumb.jpg" /&gt;&lt;/div&gt;
  &lt;div class="page-name"&gt;Mozilla&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I have an iframe #frame1</p>

<pre><code>&lt;iframe id="frame1"&gt;&lt;/iframe&gt;
</code></pre>

<p>When a user clicks on the parent #second-item div, I need the iframe #frame1 to load facebook.com</p>

<p>When a user clicks on the parent #third-item div, I need the iframe #frame1 to load mozilla.com</p>

<p>How do I do that?</p>

<p>I tried adding inside the divs #second-item and #third-item the followin onclick but it didn't work:</p>

<p>'onclick="frames['frame1'].location.href='<a href="http://sitename.com" rel="nofollow">http://sitename.com</a>'"'</p>
