I'm trying to work around a seemingly impossible customization for Wordpress. Here is what <?php the_category();?> prints out:

<ul class="post-categories" >
 <li>
  <a rel="category-tag" title="..." href="...">Category One</a>
 </li>
 <li>
  etc.
 </li>
</ul>

I need to add / insert a class into all the <a>'s, to make it look like this:

<ul class="post-categories" >
 <li>
  <a class="btn" rel="category-tag" title="..." href="...">Category One</a>
 </li>
 <li>
  etc.
 </li>
</ul>

So far, I've only found ways to assign additional classes to elements with an existing ID or class. Thanks, in advance, for your help!

I'm trying to work around a seemingly impossible customization for Wordpress. Here is what <?php the_category();?> prints out:

<ul class="post-categories" >
 <li>
  <a rel="category-tag" title="..." href="...">Category One</a>
 </li>
 <li>
  etc.
 </li>
</ul>

I need to add / insert a class into all the <a>'s, to make it look like this:

<ul class="post-categories" >
 <li>
  <a class="btn" rel="category-tag" title="..." href="...">Category One</a>
 </li>
 <li>
  etc.
 </li>
</ul>

So far, I've only found ways to assign additional classes to elements with an existing ID or class. Thanks, in advance, for your help!

• javascript
• jquery
• wordpress
• innerhtml
• addclass

• It doesn't seem at all impossible. What have you tried so far? – James Montagne Commented Mar 26, 2013 at 20:12
• Well - I meant impossible without using js... They make it very difficult to alter certain templates. – user2213177 Commented Mar 26, 2013 at 20:46

3 Answers 3

Using jQuery:

$(".post-categories a").addClass("btn");

Since the title says Using JavaScript

Try this for a JavaScript solution:

var links = document.getElementsByTagName("a");

for (var i = 0; i < links.length; i++)
{
    if (links[i].parentNode.className == "post-categories")
    {
        links[i].className = "btn";
    }
}

Or if you're down with the kids and you can use jQuery, you can do:

$(".post-categories > a").addClass("btn");

use jquery

$(function() {
$(".post-categories a").addClass("btn");
})