Passing parameters to svelte function

Question

I'm new to Svelte so forgive me if this is obvious, but I've tried solutions I've seen on other posts and none seem to have worked.

The function is called as follows: <div on:mouseover={() => exampleFunction("1")}>

and it is written in the JS as:

function exampleFunction(id){
document.getElementById(`item-${id}`).classList.remove('hidden');
}

The 'id' shows as undefined in the function, so I figured the error is where it's being passed from.

Thanks for the help in advance!

Answer 1

Check this screenshot , its working

Run it live here: https://svelte.dev/repl/501e5d478bbe4bc5a5e9f6a67523d080?version=3.16.0

Code:

<script>

    function exampleFunction(id){
  console.log("Before removing hidden",document.getElementById(`item-${id}`).classList);
        document.getElementById(`item-${id}`).classList.remove('hidden');
      console.log("After removing hidden",document.getElementById(`item-${id}`).classList); 
  }
</script>

<button on:mouseover={() => exampleFunction("1")}>
    Hover here
</button>
<span id="item-1" class="active hidden"></span>