I'm new to Joomla T3 and developing in general. I am able to get my website to incorporate JS files via the assets.xml file. However, I have no idea where to put the JS coding in the rest of the website.

The script I have loaded is scroll.js
The code in this script is:

$(document).ready(function() {
$('a').on('click', function(event) {
event.preventDefault();
var hash = this.hash;

$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
});
});

The page I am working with is here:
http://weddingknot.us/concierge-services

What I'm trying to do is incorporate a smooth scroll to the anchors on this page. For instance, the down arrow at the top of the page below "Concierge Services" should do an animate scroll down to "Concierge Tiers." And then each tier should scroll down to it's respective tier once clicked. I also have some "return to top" type buttons as well that should scroll up to the "Concierge Tiers" section of the page.

Though the T3 documentation does a solid job of describing how to get JS to load into the document, I feel as if there is as step missing as to where to include JS code when coding the site. Does one include it in the modules, or in the php files, or elsewhere? Or have I missed the "how to" section regarding JS?

I appreciate any help on this matter! And thanks in advance.