How to do calculations in an EDIT viewmodel with javascript? and html.editorfor inputs

Question

I have been struggling for days trying to figure out this problem. Now, I am not too familiar with JavaScript but I have tried many ideas and solutions given on the internet and still cannot get JavaScript to work for me Here is what I am trying to do:

I want to use the values in a number of Html.EditorFor's and do calculations with them and then put these calculations within other Html.EditorFor's in the same view in real-time. I also am wanting to get values from some HTML.EditorFor's and just display them again somewhere else in the view. Here is part of my Viewmodel as an example.

ViewModel#

 @model BSIntranet.ViewModels.JobRecapViewModel
    <link href="~/Content/EditPageStyle.css" rel="stylesheet" />

    @using (Html.BeginForm())
    {
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
    <h4>JobRecap</h4>

    <div class="col-md-12">
    @Html.ValidationSummary(true, "", new {@class = "text-danger"})

    <div id="pad" class="form-group">
        @Html.LabelFor(model => model.ANumber1, "Job_ID", htmlAttributes: new     {@class = "control-label col-md-3"})
        <div class="col-md-4">
            @Html.EditorFor(model => model.ANumber1, new {htmlAttributes = new {@class = "form-control", id = "Num1"}})
            @Html.ValidationMessageFor(model => model.ANumber1, "", new {@class = "text-danger"})
        </div>

        @Html.LabelFor(model => model.ANumber2, htmlAttributes: new {@class = "control-label col-md-3"})
        <div class="col-md-offset-8">
            @Html.EditorFor(model => model.ANumber2, new {htmlAttributes = new {@class = "form-control, id = "Num2"}})
            @Html.ValidationMessageFor(model => model.ANumber2, "", new {@class = "text-danger"})
        </div>
    </div>

    <div id="pad" class="form-group">
        @Html.LabelFor(model => model.Total, htmlAttributes: new {@class = "control-label col-md-3"})
        <div class="col-md-4">
            @Html.EditorFor(model => model.Total, new {htmlAttributes = new {@class = "form-control", id = "Total"}})
            @Html.ValidationMessageFor(model => model.Total, "", new {@class = "text-danger"})
        </div>
    //Want to display this total again in view in another section and 
    // this changes when num1 and num2 are changed in real-time
     <div id = "totalagain"> </div>

    div>
    @Html.ActionLink("Back to List", "Index")
    </div>

    @section Scripts {
    @Scripts.Render("~/bundles/jqueryval")


    }

Controller

 // GET: JobRecaps/Edit/5
    public ActionResult Edit(int? id)
    {
        if (id == null)
        {
            return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
        }
        JobRecap jobRecap = _db.JobRecaps.Find(id);
        if (jobRecap == null)
        {
            return HttpNotFound();
        }


        var viewModel = Mapper.Map<JobRecapViewModel>(jobRecap);

        var projectedSavingsAndLossCollection = _db.GetProjectedJobStatus(jobRecap.Date, jobRecap.Job_ID).ToList();
        _savingsOrLossMapper.Map(viewModel, projectedSavingsAndLossCollection);

        viewModel.PerformCalculation();


        return View(viewModel);
    }

    // POST: JobRecaps/Edit/5

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Edit(JobRecapViewModel viewModel)
    {
        if (ModelState.IsValid)
        {
            var jobRecap =_db.JobRecaps.Find(viewModel.ID);
            _jobRecapViewModelMapper.Map(jobRecap, viewModel);

            _db.SaveChanges();
            return RedirectToAction("Index");
        }


        return View(viewModel);
    }

What I have tried

<script>
$("#Num2").keyup(function(){
   total = $("#Num2").val()* $("#Num1").val();
$("#Total").val(total);
}); 

$(document).ready(function () {
$("#Total").on('input',function(){
   $('#totalagain').val($(this).val());
});
});
</script>

I have read all kinds of ways to do this and nothing has worked yet. No matter what I do none of the Javascript works. I get no results and I'm frustrated. I am the type of person who has to see the code, break it down and them put it back together to learn and I desperately would appreciate someone helping me figure this out. I have seen all kinds of articles, tutorials and such on ajax, knockout, etc, but i just can't figure it out. All I need is one example that works and I will be able to finish this view up (which happens to have about 20 calculations done on it). Thanks in advance and please don't beat me up too bad! :)