JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<form class="form-horizontal" name="adForm" id="adForm" action="#" method="post">

	<fieldset class="partA">

		<div class="form-group">
			<label for="fundsUsed" class="col-sm-4 control-label">Funds Used to Date</label>
			<div class="col-sm-4">
			  	<div class="input-group">
			  		<span class="input-group-addon">$</span>
						<input class="form-control price" type="text" id="fundsUsed" name="fundsUsed" value="">
			  		<span class="input-group-addon">.00</span>
				</div>
			</div>
		</div>
		
		<div class="extraProjectaTemplate">
	
			<div class="form-group">
				<label for="projCost" class="col-sm-4 control-label">Cost</label>
				<div class="col-sm-4">
				  	<div class="input-group">
				  		<span class="input-group-addon">$</span>
							<input class="form-control price" type="text" id="projCost" name="projCost" value="">
						<span class="input-group-addon">.00</span>
					</div>
				</div>
			</div>
	
		</div>

		<div id="container"></div>

		<div class="form-group">
			<div class="col-sm-offset-4 col-sm-4">
				<button id="addProj" type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add another project</button>
			</div>
		</div>

		<div class="form-group form-group-lg">
			<label class="col-sm-4 control-label">Total</label>
			<div class="col-sm-4">
				<div class="input-group">
					<span class="input-group-addon">$</span>
					<input class="form-control" id="totalPrice1" name="total" type="text" value="" disabled>
					<span class="input-group-addon">.00</span>
				</div>
			</div>
		</div>

	</form>

CSS

.extraProjectaTemplate {

    display: none;
}

JavaScript

$('.price').keyup(function () {

    var sum = 0;

    $('.price').each(function() {
        sum += Number($(this).val());
    });

    $('#totalPrice1').val(sum);

});

// add another part 1 of Part A

$(document).ready(function () {
     $('<div/>', {
         'class' : 'extraProjecta', html: GetHtml()
     }).appendTo('#container');
     $('#addProj').click(function () {
           $('<div/>', {
               'class' : 'extraProjecta', html: GetHtml()
     }).hide().appendTo('#container').slideDown('slow');
         
     });
})

function GetHtml() {

    var len = $('.extraProjecta').length;
    var $html = $('.extraProjectaTemplate').clone();
    $html.find('[name=projCost]')[0].name="projCost" + len;
    return $html.html();    
}