can’t use clearInterval

in trying to create a page that will show the current time which will refresh every x seconds – x is a user input
i use setInterval and clearInterval but it looks like the clearInterval doesn’t have any effect at all 🙁
here’s the code:

 <script>
      let changeTime = () => {
        let secs = document.getElementById("sec").value * 1000;
        clearInterval(timer);
        let timer = setInterval(() => {
          let d = new Date();
          document.getElementById("example").innerHTML = d.toLocaleString();
          console.log(secs);
        }, secs);
      };

      function clear() {
        clearInterval(timer);
      }

      //both functions are called with an onChange event

thanks!