As suggested by Vogon Jeltz, I studied up more on For Loops and Functions and came up with the following revision:
function DivBox( col, row )
{
var ret = "";
for( var r = 0; r < row ; r++ )
{
ret += '<div class="year'+(r+1)+'"><div id="head2" class="head container-fluid row"><h3>Year '+(r+1)+'</h3></div><div class="row table" id="Column'+(r+1)+'" >';
for( var c = 0; c < col; c++ )
{
var idM = (r+1)+"sfm"+(c+1);
var idA = (r+1)+"sfa"+(c+1);
ret += '<div class="row"><div class="col-sm-6 col-xs-3"><p>Doctor '+(c+1)+'</p></div><div class="col-sm-2 col-xs-3"><div class="input-group"><span class="input-group-addon">$</span><input type="number" id="'+idM+'" name="'+idM+'" step="0.01" value="0.00" placeholder="0.00" class="form-control"></div></div><div class="col-sm-2 col-xs-3"><p>x12 mo</p></div><div class="col-sm-2 col-xs-3"><div class="input-group"><span class="input-group-addon">$</span><input type="number" id="'+idA+'" name="'+idA+'" step="0.01" value="" placeholder="0.00" class="form-control"></div></div></div>';
}
ret += '</div></div>';
}
return ret;
}
$(document).on( "ready", function DoDivBox( col, row )
{
var obj = document.getElementById("SubFees");
var col = 5;
var row = 3;
obj.innerHTML = DivBox( row, col );
$("#SubFees").on("change input keyup", function(){
for( var r = 0; r <= row ; r++ ) {
for( var c = 0; c <= col; c++ ) {
var idM = (c+1)+"sfm"+(r+1);
var idA = (c+1)+"sfa"+(r+1);
$("#"+idA).val(parseFloat($("#"+idM).val() * 12).toFixed(2));
}}})
})form {max-width: 90%; margin: 0 auto;}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" media="all">
<body>
<form>
<fieldset id="SubFees">
</fieldset>
</form>
</body>I couldn't get the change event function to work within the DivBox for loop though so I ended up repeating the for loop in DoDivBox.