dynamically navigate and modify an object

walkHighlight.js

const highlight = (obj, path) => {
  let steps = path.split('.'),
    prop = steps.shift();

  if (obj[prop] && steps.length)
    return highlight(obj[prop], steps.join('.'));
  else if (obj[prop])
    obj[prop] = '<span style=\'background-color:yellow;\'>' + obj[prop] + '</span>';
  else
    return undefined;
};

const highlightDiffs = (diff) => {
  let { diffs, management, environment } = diff;

  for (let d in diffs) {
    let { prop } = diffs[d];

    highlight(management, prop);
    highlight(environment, prop);
  }

  return {
    highlightedManagement: JSON.stringify(management, null, 2),
    highlightedEnvironment: JSON.stringify(environment, null, 2)
  };
};

let diffs = [{
  "kind": "edited",
  "prop": "references.0.a",
  "management": {
    "_id":"foo",
    "description":"bar",
    "label":"baz",
    "path":"/foo/bar/baz",
    "references": [{ "a":"b" }]
  },
  "environment": {
    "_id":"foo",
    "description":"bar",
    "label":"baz",
    "path":"/foo/bar/baz",
    "references": [{ "a":"xyz" }]
  }
}].map(highlightDiffs);