call the same jQuery function in multiple link <a>

I am not really familiar with jQuery.
the idea is
link a href="..?episode=1"will be add class active, while the other link will not be add class active
link a href='..?episode=2" will be added class active, while the other link will not be active add class
Similar to other links. I have code html

<ul id="episode">
    <li><a  href="index.php?episode=1" class="active">1</a></li>
    <li><a  href="index.php?episode=2">2</a></li>
    <li><a  href="index.php?episode=3">3</a></li>
    <li><a  href="index.php?episode=4">4</a></li>
</ul>

code js

$(document).ready(function() {
    $("a").click(function(){
        if($("a").text()!="1"){
            $("a.active1").removeClass("active1");
            $("a").addClass("active1");
            alert($(this)).text();
        }
    })
})

The problem is when one episode is selected, the message pops up 2 times and class are added to and then is removed.I do not know what the reason is? there i can tell me one way is no solution


Source: jquery

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.