I'm struggling to use JavaScript and jQuery to highlight the current list item on my main menu. As a beginner in scripting, I am having trouble figuring out what's wrong with the code. Here is the code snippet that I have been working with.
<ul id="#mainMenu">
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
<script type="text/javascript">
$('#mainMenu li a').on('click', function(){
$('li a.active').removeClass('active');
$(this).addClass('active');
});
</script>