将输入数量添加到父元素并设置为新元素

Question

我正在尝试创建功能以获取div文本和用户输入的总和，并在新的范围中显示。我似乎无法找出使用foreach为每个具有相同类的输入工作的结构。

＆＃13;

＆＃13;

$('#go').on('click', function(){
	
  $('.adjust').each(function(){
  
  var sum = 0;
  var cost = $(this).parents().eq(0).find('.cost').data('total');
  var adjust = parseInt($(this).val(), 10) || 0;
  
  $(this.parents().eq(1).find('.total').text(cost - adjust))

})
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span data-total='100' class='cost'>100</span> +
<input class='adjust'> =
<span class='total'>0</span>
<br/>
<span data-total='100' class='cost'>100</span> + 
<input class='adjust'> = 
<span class='total'>0</span>
<br/>
<span data-total='100' class='cost'>100</span> +
<input class='adjust'> = 
<span class='total'>0</span>
<br/>
<br/><br/>
<input type='button' id='go' value='Go'>

＆＃13;

＆＃13;

＆＃13;

Answer 1

＆＃13;

＆＃13;

$('#go').on('click', function(){
	
  $('.adjust').each(function(){
  
  var sum = 0;
  var cost = $(this).parents().eq(0).find('.cost').data('total');
  var adjust = parseInt($(this).val(), 10) || 0;
  
  $(this).find('.total').text(cost - adjust))

})
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span data-total='100' class='cost'>100</span> +
<input class='adjust'> =
<span class='total'>0</span>
<br/>
<span data-total='100' class='cost'>100</span> + 
<input class='adjust'> = 
<span class='total'>0</span>
<br/>
<span data-total='100' class='cost'>100</span> +
<input class='adjust'> = 
<span class='total'>0</span>
<br/>
<br/><br/>
<input type='button' id='go' value='Go'>

＆＃13;

＆＃13;

＆＃13;