Change menu class

Question

Good morning. I have the following menu:

<ul>
<li class="active"><a href="?type=0">Ranking PvP</a></li>
<li><a href="?type=2">Ranking Clãs</a></li>
<li><a href="?type=1">Ranking Guilds</a></li>
</ul>

Where class="active" defines a different coloring for which tab is open. I would like the user to choose the Clan Ranking for example, change the class from the pvp menu to none and the clan Ranking to active. I tried it this way but I was unsuccessful:

<script>
$("#li2").click(function(){
$("li1").removeClass("active");
$("li2").addClass("active");
});
</script>
<ul>
<li id="l1" class="active"><a href="?type=0">Ranking PvP</a></li>
<li id="l2"><a href="?type=2">Ranking Clãs</a></li>
<li id="l3"><a href="?type=1">Ranking Guilds</a></li>
</ul>

Answer 1

in a simpler way, just put in the event of the click or any other you want to remove all classes active of ul and just put in the this current which is exactly where you clicked, see an example : https://jsfiddle.net/acqndz4j/

Answer 2

You did not specify the selector for the element id, see the documentation here:

$("#li1").removeClass("active");
$("#li2").addClass("active");