I have a function which have multiple onChange events inside of it. Let's take a simple example with one event.

Now when I click the button the loadScript() loads and then if #domelement changes, I get the console log. But if I click the button multiple times, the script is loaded multiple times...and then onChange event I get console log multiple times, as many times as I clicked the button.

Pardon my simple code, I hope it helps you understand my problem. I want to load the script once on button click.

function loadScript() {
  $('#domelement').on('change', function() {
    console.log('Dom Element Changed');
  })
}

$('#load').on('click', function() {
  loadScript();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="load">LoadScript</button>