Style “Current” State of Nav Links Using Custom Code

[Pablo_Esquivel]

Hello everyone,

I am building a nav bar with an expandable menu to display the projects for my portfolio. I want to add a class to the “work” nav link so I can bold the text once someone clicks on it to open the menu and disable it when they close it.

I tried using custom code to add the class “current” to the nav link with class “open” to change the font-weight but I seem to be doing something wrong because the class isn’t getting selected.

<Style>
  .current {font-weight:700;}
</Style>

<script>
  $('.open').on('click', function(){
    $('.open').addClass('current');
  });

  $('.close').on('click', function(){
    $('.open').removeClass('current');
  });
</script>

---

READ ONLY:
https://preview.webflow.com/preview/portfolio-e1044c?utm_medium=preview_link&utm_source=designer&utm_content=portfolio-e1044c&preview=74758237935edbd10377c0debecc2001&pageId=62d43c0a6105de0e523ccf17&workflow=preview

LIVE SITE:
https://portfolio-e1044c.webflow.io/work/work

[mattsims]

Your code is currently set to remove the current class on open?

  $('.open').on('click', function(){
    $('body').addClass('no-scroll');
    $('.open').removeClass('.current');
  });

  $('.close').on('click', function(){
    $('body').removeClass('no-scroll');
  });