It is always easy to work when every asset is segregated from other. But in normal practice we write js in our html template files. Another mistake we bind our js events on ids, css classes which should not be there, by looking the htmlit will confuse you why you use the css property to give style or to give js functionality. Best practice is to use data property of the element.
<%= link_to "Update Credit Card", "#", data: { behavior: "update-credit-card" } %> and bind the js event on data
$(document).on("click", "[data-behavior~=update-credit-card]", function(){
// code }) our body tag should looks like class="<%= controller_name %> <%= action_name %>">
<%= yield %>
</body> because by doing this we can write css on controller basis and for more specific we can take action help as well.
