How to change style of element in iFrame
===

<h1>The Problem:</h1>

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.

My current code is as follows:

<h3>HTML (Main Webpage):</h3>

    <!DOCTYPE html>
     <html>
      <head>
       <title>Example Page</title>
       <script type="text/javascript">
        var currentTag = function(tag){
         var currentPage = document.frames['tag_list'].document.getElementById(tag+'_tag-list'); currentPage.style.fontWeight = "bold";
        };
        currentTag("home")
       </script>
      </head>
      <body>
       <header>
        <!--All header code-->
       </header>
       <!--Sidebar (Problem)-->
       <iframe src="myframe.html" scrolling="no" id="tag_list">Your browser does not support the "iframe" element, please update...</iframe>
       <div id="content">
        <!--All content-->
       </div>
       <footer>
        <!--All footer code-->
       </footer>
      </body>
     </html>

<h3>HTML (iFrame):</h3>

    <!DOCTYPE html>
    <html>
     <head>
      <title>Sidebar Frame</title>
     </head>
     <body>
      <div id="tag_list">
       <h2>Pages</h2>
       <ul>
        <li><a href="#"><span id="home_tag-list">Homepage</span></a></li>
        <!--And all the other pages-->
       </ul>
      </div>
     </body>
    </html>

Your help is much appreciated :D