https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238355#M79577 <P>The problem is that querySelector only returns the first matching element, but you want all matching elements.&nbsp; Instead, you can use querySelectorAll.&nbsp; The last part would then go something like this instead:</P><LI-CODE lang="javascript"> const sublayersElements = document.querySelectorAll(".list_item"); for (var x = 0; x &lt; sublayersElements.length; x++) { sublayersElements[x].addEventListener("click", (event) =&gt; { const id = event.target.getAttribute("data-id"); if (id) { const sublayer = layer.findSublayerById(parseInt(id)); const node = document.querySelector(".list_item[data-id='" + id + "']"); sublayer.visible = !sublayer.visible; node.classList.toggle("visible-layer"); } }); }</LI-CODE><P>&nbsp;</P><P>&nbsp;</P> Tue, 06 Dec 2022 16:40:30 GMT JoelBennett 2022-12-06T16:40:30Z https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238197#M79572 <P>&nbsp;</P><P>Hi there,&nbsp;</P><P>I'm currently working with this example to attempt to link MapIMageLayer - Sublayers to checkboxes instead of button divs as per the example</P><P><A href="https://developers.arcgis.com/javascript/latest/sample-code/layers-mapimagelayer-sublayers/" target="_blank" rel="noopener">MapImageLayer - Toggle sublayer visibility | Sample Code | ArcGIS API for JavaScript 4.25 | ArcGIS Developers</A></P><P>I can get the first checkbox working but the others are unresponsive. I have simply tried to replicate their code using Li checkbox inputs rather than Button Div inputs</P><P>heres a pen of my attempts</P><P><A href="https://codepen.io/10ldavis/pen/jOKXgxQ" target="_blank" rel="noopener">A Pen by Leon (codepen.io)</A></P><P>any help is really appreciated, it's been a while...&nbsp; :')</P><P>Best,</P><P>Leon</P><P>&nbsp;</P> Tue, 06 Dec 2022 13:06:40 GMT https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238197#M79572 LeonDavis 2022-12-06T13:06:40Z https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238355#M79577 <P>The problem is that querySelector only returns the first matching element, but you want all matching elements.&nbsp; Instead, you can use querySelectorAll.&nbsp; The last part would then go something like this instead:</P><LI-CODE lang="javascript"> const sublayersElements = document.querySelectorAll(".list_item"); for (var x = 0; x &lt; sublayersElements.length; x++) { sublayersElements[x].addEventListener("click", (event) =&gt; { const id = event.target.getAttribute("data-id"); if (id) { const sublayer = layer.findSublayerById(parseInt(id)); const node = document.querySelector(".list_item[data-id='" + id + "']"); sublayer.visible = !sublayer.visible; node.classList.toggle("visible-layer"); } }); }</LI-CODE><P>&nbsp;</P><P>&nbsp;</P> Tue, 06 Dec 2022 16:40:30 GMT https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238355#M79577 JoelBennett 2022-12-06T16:40:30Z https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238660#M79587 <P>Hi Joel,</P><P>Thanks so much for this, that makes sense.&nbsp;</P><P>I wish you a great week&nbsp;</P><P>Best,</P><P>Leon</P> Wed, 07 Dec 2022 12:01:29 GMT https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/linking-mapimagelayer-sublayers-to-checkboxes-in-a/m-p/1238660#M79587 LeonDavis 2022-12-07T12:01:29Z