I am trying to isolate and add a class to a clicked anchor tag. The tags are getting pulled from a Wordpress loop. I can write JQuery to remove the "static" class, but it is removing the class from all tags in the div rather than just the one clicked and not adding the "
active" class.
Here is the WP loop
<div class="more">
<a class="static" href="<?php bloginfo('template_url'); ?>/work/">ALL</a>
<?php
foreach ($tax_terms as $tax_term) {
echo '<a class="static" href="' . esc_attr(get_term_link($tax_term, $taxonomy)) . '" title="' . sprintf( __( "View all posts in %s" ), $tax_term->name ) . '" ' . '>' . $tax_term->name.'</a>';
} ?>
</div>
Generates this html:
<div class="more">
<a class="static" href="#">ALL</a>
<a class="static" href="#">Things</a>
<a class="static" href="#"> More Things</a>
<a class="static" href="#">Objects</a>
<a class="static" href="#">Goals</a>
<a class="static" href="#">Books</a>
<a class="static" href="#">Drawings</a>
<a class="static" href="#">Thoughts</a>
</div>
JQuery:
$("div.more a").on("click", function () {
$("a.static").removeClass("static");
$(this).addClass("
active");
});
I have reviwed the other similar questions here and here, but neither solution is working for me. Can this be done with JQuery or should I put a click event in the html inline anchor?
It looks like it is working just for a second until the page reloads.
