What could cause window.onload to fire infinitely?

I have a web page with a bunch of automatically generated contents (I can’t touch the HTML). Usually, what happens is:

1. User selects something on the web page (ex. enter donation amount)
2. User clicks a button to enter personal information (as far as I know, the inputs are loaded after the button is clicked and takes around 1-2 seconds to load)

I’m trying to add some code to allow the user to enter some information before clicking the button, and the logic basically works like this:

1. the web page is loaded
2. place mydiv between some automatically generated contents
3. when user selects an option, put that information in local storage
4. when user clicks the button to generate personal informations, use setinterval to try to put the value in local storage in the corresponding field every 100ms, and call clearInterval when it succeeds (basically, it should work with 100ms of the personal information fields being loaded)

<style>
    /* some styles */
</style>

<div id="mydiv">
    <span style="font-weight:bold; margin-left: 12px;">
        Please select an option
    </span>
    <div id="mydiv-options" style="margin-left: 14px;">
        <input id="getinfo-mydiv" type="radio" name="mydiv-question" onclick="setstorage(0)">
        </input>
        <label for="getinfo-mydiv">
            option1
        </label>
        <br>

        <input id="future-mydiv" type="radio" name="mydiv-question" onclick="setstorage(1)">
        </input>
        <label for="future-mydiv">
            option2
        </label>
        <br>

        <input id="already-mydiv" type="radio" name="mydiv-question" onclick="setstorage(2)">
        </input>
        <label for="already-mydiv">
            option3
        </label>
        <br>
        <div id="clear-selection" onClick="clearSelection()">
            Clear selection
        </div>
    </div>
</div>

<script>
    // some functions
    let repeatTryCheck = null
    function setstorage(x) {
       console.log("setstorage")
        window.localStorage.setItem('selected', x)
    }
    function tryClickInput() {
        console.log('tryClickInput')
        let elementLoadedAfterUserClicksButton = document.getElementById("some-input")
        if (elementLoadedAfterUserClicksButton == null) {
            return
        } else {
            clearInterval(repeatTryCheck)
        }
        // do stuff with the value from storage
    }
    function tryClickUntilLoaded() {
       console.log("tryClickUntilLoaded")
       repeatTryCheck = setInterval(tryClickInput, 100) // 10x per second
    }

    function placeBeforeGeneratedDiv() {
        console.log("placeBeforeGeneratedDiv")
        let comments = document.getElementById("generateddiv")
        comments.insertAdjacentElement('beforebegin', document.getElementById("mydiv"))
        document.getElementById("mydiv").style.display = "block"
    }
    var i = 0;
    function init() {
        console.log("init")
        placeBeforeGeneratedDiv() // place mydiv before generateddiv
        document.getElementById('button-to-load-personal-info').addEventListener('click', tryClickUntilLoaded)
        setstorage(null)
        console.log(i)
        i = i + 1
    }
    window.onload = init
</script>

The problem I keep getting is that the init function keeps getting called and I can’t figure out what’s causing it (I used this code on another page and it worked well)

Thanks