title: Changing the class name of joomla top menu
body: <p>I am trying to create a joomla 2.5 template. I am using the following code in my index.php to display the top menu items. </p>
  
  <pre><code> &lt;?php if ($this-&gt;countModules('topmenu')): ?&gt;    
    &lt;hr&gt;
    &lt;div class="container"&gt;
       &lt;jdoc:include type="modules" name="topmenu"/&gt;
    &lt;/div&gt;
  &lt;?php endif; ?&gt;
  </code></pre>
  
  <p>The above code generates the following html</p>
  
  <pre><code>&lt;ul class="menunav"&gt;
     &lt;li class="item-464 active"&gt;&lt;a href="/joomla2/" &gt;Home&lt;/a&gt;&lt;/li&gt;
     &lt;li class="item-444"&gt;&lt;a href="/joomla2/index.php/sample-sites" &gt;Sample Sites&lt;/a&gt;
     &lt;/li&gt;&lt;li class="item-207"&gt;&lt;a href="http://joomla.org" &gt;Joomla.org&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The problem is the class name that I have used for designing the top menu items is <code>nav</code> and the menu should work perfectly if I have the html like following</p>
  
  <pre><code>  &lt;ul class="nav"&gt;
        &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Sample Sites&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Joomla ORG&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  </code></pre>
  
  <p>I have heard about <a href="http://docs.joomla.org/Using_Class_Suffixes" rel="nofollow">class suffix</a>, but I am trying not to get it done from the the admin panel. Because every time a new user uses my template will have to add the class suffix from the admin panel.</p>
  
  <p>I have tried the following code, but it is not changing anything:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function() {
         $('.menunav').removeClass('menunav').addClass('nav');
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Could you please tell me how to change the top menu class name in joomla 2.5</p>