My html and javascript code is not working on Safari

I have written a html and javascript files. Here is my code HTML: '''

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width">

    <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Bitter|Ubuntu+Mono' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="style.css">

  </head>

  <body>
  <div class="wrapper">
    <ul>

      <li>New value: <span class="my-new"></span></li>

    </ul>
  </div>
  </body>
  <script src="event.js"></script>
</html>

and here is my javascript code

window.addEventListener('storage', function(e) {

  document.querySelector('.my-new').textContent = e.newValue;
  
});

I write something on another page and want to display it on another page(the code of this page is shown here). Everything is fine, the code is working on Chrome. However, when I open it on safari, it does not display.

Javascript is enabled. I have no idea what is the problem. Please, help