There is another aspect to making your script unobtrusive that removing it from the HTML doesn't deal with and that is to make it unobtrusive with respect to any other JavaScripts that are in the same page.
Multiple scripts in the same page clash when they both attempt to use the same variable or function in the global namespace for different purposes. There are two ways of fixing such clashes. One way is to rename the fields that clash in one of the scripts so that they no longer clash. The other is to rewrite the scripts themselves to reduce or even eliminate the opportunity for them to clash with other scripts by reducing or removing their impact on the global namespace.
It is this second option that we are going to look at here because despite the fact that it sounds like the more complicated of the two options it is in fact the easier one of the two to implement.
Why I have referred to reducing and eliminating clashes as two separate references is because there are actually two steps that are needed in order to eliminate clashes and we are going to consider them separately since they can each be implemented independently of one another.
The one we are going to look at here is a quick and simple way of removing all of your script except for event handlers from the global scope.
Making this one simple change to your script will remove all possible conflicts apart from where multiple scripts attempt to attach the same event handler to the same element in the page and therefore have one of them overwrite the other. Fixing that problem is the other step that will be dealt with separately.
Now the first thing that you need to do in order to be able to apply this step is to apply all the necessary changes to your code in order to place all the JavaScript that belongs to your script into the one JavaScript file. If you have any references to the code in separate files (such as within the HTML) then you first need to separate the JavaScript out into its own file and to gather all of the code that relates to your script together in the same place separate from any code needed for other scripts.
With this done it is then just a matter of adding two extra lines into your JavaScript and they are always the same two lines.
The following goes at the top of your script:
(function () {
The following then goes at the bottom of your script:
})();
Those two lines wrap all of your code into an anonymous self executing function. Because it is self executing it will run straight away meaning that it will run at exactly the same time as it would have done prior to your adding those two extra lines of code. Because it is wrapping everything inside a function it changes the scope of everything in your code that does not explicitly mention window to be local to within the function and therefore completely separate from any variables and functions that exist outside of this new function.
This removes all possible clashes between scripts apart from where two scripts both try to attach code to the same event handler on the same element.