IE 11 Issues with Custom Code

[pmacMaps]

I'm working on upgrading a v1.4.9 to v2.7.0 app. The development site is https://gis.ccpa.net/labs/caedc-idm/. I have some custom code that creates a legend. The app is working on Google Chrome, but not Internet Explorer. The issue appears to be related to some custom code. Even after running the code through https://babeljs.io/repl, I am still getting the following error in IE: "SCRIPT1014: Invalid character; File: init.js, Line: 28, Column: 392".

When I comment out the code, the app loads in IE and Chrome (but without creating the legend).

The ES6 code is at https://github.com/pmacMaps/shortlist-storytelling-template-js/blob/master/app/custom-scripts.js#L7.

Here is the transpiled code:

require(["esri/request"], function(esriRequest) {
            // function to get legend info in json format
            function requestLegendJson(url) {
                // request object
                const requestHandle = esriRequest({
                    url: url,
                    content: {f: "json"},
                    handleAs: 'json',
                    callbackParamName: 'callback'
                });           
                // make request
                requestHandle.then(
                    function(response) {
                        // https://babeljs.io/repl was used to convert ES6 code at 
                        // https://github.com/pmacMaps/shortlist-storytelling-template-js/blob/master/app/custom-scripts.js
                        // into IE compatible code
                        // legend container element
                        const legendElement = $('#customLegend');                     
                        // layers in response                        
                        const layers = response.layers;
                        var _iteratorNormalCompletion = true;
                        var _didIteratorError = false;
                        var _iteratorError = undefined;

                        try {
                          for (var _iterator = layers[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
                            var item = _step.value;

                            // default layer name
                            var layerName = item.layerName;
                            // loop through legend properties
                            var _iteratorNormalCompletion2 = true;
                            var _didIteratorError2 = false;
                            var _iteratorError2 = undefined;

                            try {
                              for (var _iterator2 = item.legend[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
                                var element = _step2.value;

                                // open legend list element
                                var legendContent = "<ul>";
                                // if the label element is empty, we'll use item.layerName as the name of the legend element
                                // if it is not, we'll use the label property of the legeng as the name for the legend element
                                if (element.label === " " || element.label === "") {
                                  legendContent += "<li>" + layerName + "</li>";
                                } else {
                                  legendContent += "<li>" + element.label + "</li>";
                                }
                                // create image element
                                legendContent += "<li><img height=" + element.height + " width=" + element.width + " src=\"data:" + element.contentType + ";base64," + element.imageData + "\" alt=\"legend icon representing " + layerName + "\" /></li>"; // close list element
                                legendContent += "</ul>";
                                // append legend item to legend
                                legendElement.append(legendContent);
                              } // end for element of item.legend                                             
                            } catch (err) {
                              _didIteratorError2 = true;
                              _iteratorError2 = err;
                            } finally {
                              try {
                                if (!_iteratorNormalCompletion2 && _iterator2.return) {
                                  _iterator2.return();
                                }
                              } finally {
                                if (_didIteratorError2) {
                                  throw _iteratorError2;
                                }
                              }
                            }
                          } // end for item of layers
                        } catch (err) {
                          _didIteratorError = true;
                          _iteratorError = err;
                        } finally {
                          try {
                            if (!_iteratorNormalCompletion && _iterator.return) {
                              _iterator.return();
                            }
                          } finally {
                            if (_didIteratorError) {
                              throw _iteratorError;
                            }
                          }
                        }
                                
                }, // end function(response)
                    function(error) {
                        console.warn(`Error creating legend element for url ${url}`);
                        console.warn("Error: ", error.message);
                        // feel free to update error reporting code
                    });
            } // end requestLegendJson(url)
            
            // Map Service Legend Urls
            const municipalityLegendUrl = 'https://gis.ccpa.net/arcgiswebadaptor/rest/services/ArcGIS_Online/MunicipalBoundaries/MapServer/legend';
            const landTrailsLegendUrl = 'https://gis.ccpa.net/arcgiswebadaptor/rest/services/ArcGIS_Online/LandTrailsData/MapServer/legend';
            const waterTrailsLegendUrl = 'https://gis.ccpa.net/arcgiswebadaptor/rest/services/ArcGIS_Online/WaterTrailsData/MapServer/legend';
            const parksLegendUrl = 'https://gis.ccpa.net/arcgiswebadaptor/rest/services/ArcGIS_Online/ParksData/MapServer/legend';           
            
            // call functions to get legend JSON and construct legend elements  
            requestLegendJson(municipalityLegendUrl);
            requestLegendJson(landTrailsLegendUrl);
            requestLegendJson(waterTrailsLegendUrl);
            requestLegendJson(parksLegendUrl);           
        }); // end require(["esri/request"], function(esriRequest) {})