jquery - How do I add a class to inner HTML of a div using Javascript? - Stack Overflow

admin管理员组

文章数量:1357633

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

Share Improve this question Follow asked Mar 26, 2013 at 20:09 user2213177user2213177 2722 silver badges33 bronze badges 2

• 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

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

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");
})

本文标签： jqueryHow do I add a class to inner HTML of a div using JavascriptStack Overflow