Javascript CFv7

I'm trying to mirror a form I have on CFv5 which uses javascript to add up numbers entered in the form. This works fine in CFv5 but I can't see how to make it work in CFv7. I've added a javascript element at the bottom of views on page 1 but nothing happens on the form itself. Here is the code I'm using. I've tried with and without the top section.

<?php
JHtml::_('jquery.framework');
?>

var j = jQuery.noConflict();
j(document).ready(function(jQ)
{
jQ('#Subs').change(calc);
jQ('#Subs1').change(calc);
jQ('#Subs2').change(calc);
jQ('#Subs3').change(calc);
jQ('#Subs4').change(calc);
jQ('#Subs5').change(calc);
jQ('#essentials').click(calc);
jQ('#essentials1').click(calc);
jQ('#essentials2').click(calc);
jQ('#branch').change(calc);
jQ('#localbranchdonation').change(calc);
jQ('#Total').click(calc);
jQ('#Donation').change(calc);
j
function calc()
{
var sum, sum1, sum2, sub, don, ess, br;
br = '';
sub = 0;
ess = 0;
don = 0;
sum = 0;
sub = jQ('input[name=membership]:checked').val();
if(sub === undefined){sub = 0;}
br = jQ('#branch').find(":selected").text();
if((br === 'VIC/TAS') || (br === 'SA')){sub = 0;}
don = jQ('#Donation').val().replace(/\$/g, '');
if(don === ''){don = 0;}
ess = jQ('input[name=essentials]:checked').val();
if(ess === undefined){ess = 0;}
if((br !== 'VIC/TAS') && (br !== 'SA')){ess = 0;}
don2 = jQ('#localbranchdonation').val().replace(/\$/g, '');
if(don2 === ''){don2 = 0;}
sum1 = parseInt(sub);
sum2 = parseInt(ess);
sum3 = parseInt(don);
sum4 = parseInt(don2);
sum = (sum1 + sum2 + sum3 + sum4);
jQ('#Total').val(sum);
}

});

I've also found that if I include a javascript element the event trigger I've used on other fields no longer works.
​
Any suggestins would be helpful.
​
Thanks.