Cacher is the code snippet organizer for pro developers

/**
 * update main content
 */

/**
 * First - Grab the array-like objects for all h4 and p child nodes
 */
const textContentH4 = document.querySelectorAll(".text-content h4");
const textContentP = document.querySelectorAll(".text-content p");

/**
 * Second - convert to arrays
 */
const tCH4Array = Array.from(textContentH4);
const tCPArray = Array.from(textContentP);

/**
 * Grab all the keys from the sitecontent object
 */
const keysArr = Object.keys(siteContent["main-content"]);

/**
 * Filter out the h4 related keys
 */
const keysH4 = keysArr.filter(item => item.includes("h4"));

/**
 * Filter out the p related keys
 */
const keysP = keysArr.filter(item => item.includes("content"));

/**
 * Loop over the h4 elements and set them equal to corresponding key in the h4 sitecontent keys array
 * Also loop over the p elements and set them equal to their corresponding p keys from sitecontent
 */

for (let i = 0; i < tCH4Array.length; i++) {
  tCH4Array[i].innerHTML = siteContent["main-content"][keysH4[i]];
  tCPArray[i].innerHTML = siteContent["main-content"][keysP[i]];
}