title: Change width of menu items depending on amount of menu items
body: <p>Using Joomla I have got 4 menu items. One of them is optional. If I want to unpublish this menu item, the other menu items width should be increased, but only at viewport min-width 980px.
  The menu has the id #menu, the elements width I want to change is #menu li. The menu item which is optional has .optMenuitem as its classname. For four menu items the width should be 25%, for three 33.33% than. 
  I thought of sth like:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function changeWidth (){
   var four = document.getElementsByClassName('optMenuitem');
   var opt = document.getElementByID('menu');
   if (four==true){
    opt.li.style.width = "25%";
   } else {
    opt.li.style.width = "33.33%";
   }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Does not work. I'm a newbie. Any suggestions?</p>