forループは正しく実行されません

Question

私は、1つのクラス名を持つ異なる数値の要素のinnerHTMLの値を変更する関数を作成しようとしています。以下のように

：

<div class="ingredient-assignment__quantity">5</div> 
<div class="ingredient-assignment__quantity">300</div> 
<div class="ingredient-assignment__quantity">250</div> 

そして、私は（すべてで同じ）の計算は、それらのすべてを介して実行し、各結果にそれぞれのinnerHTMLプロパティを変更したいです。

calcuation = 5 * innerHTML; 
<div class="ingredient-assignment__quantity">25</div> 
<div class="ingredient-assignment__quantity">1500</div> 
<div class="ingredient-assignment__quantity">1250</div> 

私のJS関数は次のようになります：

のようにforループを除く

function ingredientChange(){ 


var portionsBefore = document.getElementById('portions'); 
    var ingredients = document.getElementsByClassName('ingredient-assignment__quantity'); 

    function getPortions(event) { 
    const getID = event.target.id; 
    if (getID == "minus") { 
     var y = Number(portionsBefore.innerHTML) - 1; 
    } 
    else { 
     var y = Number(portionsBefore.innerHTML) + 1; 
    } 

    changeIngredients(y); 
    portionsBefore.innerHTML = y; 
    } 

    function changeIngredients(y) {  
    var arr = Object.keys(ingredients).map((k) => ingredients[k]) 
    for(var i = 0; i < arr.lenght; i++){ 
     var changeValues = Number(arr[i].innerHTML)/Number(portionsBefore.innerHTML); 
     var changedValues = Number(changeValues) * y; 
    } 
    } 

    function addEventListeners() { 
    document.getElementById('minus').addEventListener('click', getPortions, false); 
    document.getElementById('plus').addEventListener('click', getPortions, false); 
    } 
    addEventListeners(); 
} 

ingredientChange(); 

そして、すべてが正常に動作します。

私は、あなたがあなたのforループ

arr.lenghtにタイプミスがarr.lengthする必要があります持っているforループ

Answer 1

でいただきました！間違って見つける傾けます。