title: How to change style of element in iFrame
body: <h1>The Problem:</h1>
  
  <p>I am designing a site which uses the same sidebar on all pages, so I put the sidebar in an iFrame for easy editing later... But on each page I want the current page link in the iFrame to be in bold font... Please could you help with a JavaScript statement or function that could to this.</p>
  
  <p>My current code is as follows:</p>
  
  <h3>HTML (Main Webpage):</h3>
  
  <pre><code>&lt;!DOCTYPE html&gt;
   &lt;html&gt;
    &lt;head&gt;
     &lt;title&gt;Example Page&lt;/title&gt;
     &lt;script type="text/javascript"&gt;
      var currentTag = function(tag){
       var currentPage = document.frames['tag_list'].document.getElementById(tag+'_tag-list'); currentPage.style.fontWeight = "bold";
      };
      currentTag("home")
     &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
     &lt;header&gt;
      &lt;!--All header code--&gt;
     &lt;/header&gt;
     &lt;!--Sidebar (Problem)--&gt;
     &lt;iframe src="myframe.html" scrolling="no" id="tag_list"&gt;Your browser does not support the "iframe" element, please update...&lt;/iframe&gt;
     &lt;div id="content"&gt;
      &lt;!--All content--&gt;
     &lt;/div&gt;
     &lt;footer&gt;
      &lt;!--All footer code--&gt;
     &lt;/footer&gt;
    &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <h3>HTML (iFrame):</h3>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
   &lt;head&gt;
    &lt;title&gt;Sidebar Frame&lt;/title&gt;
   &lt;/head&gt;
   &lt;body&gt;
    &lt;div id="tag_list"&gt;
     &lt;h2&gt;Pages&lt;/h2&gt;
     &lt;ul&gt;
      &lt;li&gt;&lt;a href="#"&gt;&lt;span id="home_tag-list"&gt;Homepage&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;!--And all the other pages--&gt;
     &lt;/ul&gt;
    &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Your help is much appreciated :D</p>