javascript - How to Toggle Two Elements Simultaneously Using Pure JS -

i trying figure out how toggle 2 elements @ same time:

one element fades-in while fades-out works fine, need change/add class element. have nav menu hides , shows div's need highlight links , in pure vanilla javascript. thinking [hoping] execute using element.toggle class.

any appreciated.

html:

<div>     <section class="" id="home">         <p>...stuff</p>     </section>      <section class="" id="about">         <p>...stuff</p>     </section>      <section class="" id="contact">         <p>...stuff</p>     </section>      <div>         <a href="javascript:toggle('home', 'home-btn')" id="home-lnk" class="active">home</a>         <a href="javascript:toggle('about', 'about-btn')" id="about-lnk">about</a>         <a href="javascript:toggle('contact', 'contact-btn')" id="contact-lnk">contact</a>     </div> </div> 

javascript: edit: currently div's toggle link highlights wrong link

<script type="text/javascript">      var divs = [ "home", "about", "contact" ];     var lnks = [ "home-lnk", "about-lnk", "contact-lnk" ]      function toggle(layer) {         var d, l         for(var = 0; < divs.length && lnks.length; += 1) {              d = document.getelementbyid(divs[i]);             d.style.opacity = '0';              l = document.getelementbyid(lnks[i]);             l.classname = '';         }          d = document.getelementbyid(layer);         d.style.transition = 'opacity 1s';         d.style.opacity = '1';          l = document.getelementbyid(lnks[i]);         l.classname += 'active';     }  </script> 

easy!

i missing semicolon after:

var lnks = [ "home-lnk", "about-lnk", "contact-lnk" ];