How to hide sidenav in Materialize CSS when link is clicked?

Change your sidebar init to this:

$(document).ready(function(){
    $('.sidenav')
        .sidenav()
        .on('click tap', 'li a', () => {
            $('.sidenav').sidenav('close');
        });
});

Updated fiddle.

You can simply add class="sidenav-close" to your 'ul'. This will wrap all your links. So when you click anything inside the 'ul' the sidebar will be closed.

    <ul class="sidenav sidenav-close" id="mobile-demo">
      <li><a href="#">Item 1</a></li>
      <li><a href="#">Item 2</a></li>
      <li><a href="#">Item 3</a></li>
      <li><a href="#">Item 4</a></li>
    </ul>