forEach function (for array, objects and strings)

Function you pass a collection and a callBack function that takes index and value parameters. Arrays, Strings and Objects are supported.

by harifrais

HTML

<div id="outputTempDiv">
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404338930" style="padding:10px;">
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductTitle" title="Product Title"><a href="javascript:void(0)">Product Name / Title</a></div>
</div>
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404340303" style="padding:10px;">
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductDesc" title="Product Description">Product Description</div>
</div>
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404341539" style="padding:10px;">
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductSponsoredBy" title="Brand">Brand Name</div>
</div>
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404342986" style="padding:10px;">
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductPrice" title="Original Price (Before discount)" style="text-decoration: line-through;">$12.50</div>
</div>
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404346214" style="padding:10px;">
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductImage" title="Product Image"><a href="" style="color:inherit;text-decoration: inherit;border: 0px;" target="_blank"><img src="../../../assets/images/picture.png" style="width:100%;height:auto;"></a><a href="" style="color:inherit;text-decoration: inherit;border: 0px;" target="_blank"><img src="../../../assets/images/picture.png" style="width:100%;height:auto;"></a></div>
   <div _ngcontent-pol-c410="" draggable="true" class="selected" id="ProductImage" title="Product Image"></div>
</div>
<div _ngcontent-pol-c410="" title="Drop here" class="aro-placontainer" id="containerdiv_1635404349725" style="padding:10px;">
   <div...

JavaScript

let outputContainer = document.querySelector("#outputTempDiv");
    outputContainer.querySelectorAll('div').forEach(function(node) {
        // Do whatever you want with the node object.
        /* console.log(node.id) */;
        if(node.id == 'ProductTitle'){
        	console.log(node)
          node.setAttribute.textContent = '$!{product.title}'
        }
    });