Add mass listener snippets

snippets/addEventListenerAll.md

@@ -0,0 +1,23 @@
+---
+title: addEventListenerAll
+tags: browser,event,intermediate
+---
+
+Attaches an event listener to all the provided targets.
+
+- Use `Array.prototype.forEach()` and `EventTarget.addEventListener()` to attach the provided `listener` for the given event `type` to all `targets`.
+
+```js
+const addEventListenerAll = (targets, type, listener, options, useCapture) => {
+  targets.forEach(target =>
+    target.addEventListener(type, listener, options, useCapture)
+  );
+};
+```
+
+```js
+addAllEventListeners(document.querySelectorAll('a'), 'click', () =>
+  console.log('Clicked a link')
+);
+// Logs 'Clicked a link' whenever any anchor element is clicked
+```

snippets/removeEventListenerAll.md

@@ -0,0 +1,28 @@
+---
+title: removeEventListenerAll
+tags: browser,event,intermediate
+---
+
+Detaches an event listener from all the provided targets.
+
+- Use `Array.prototype.forEach()` and `EventTarget.removeEventListener()` to detach the provided `listener` for the given event `type` from all `targets`.
+
+```js
+const removeEventListenerAll = (
+  targets,
+  type,
+  listener,
+  options,
+  useCapture
+) => {
+  targets.forEach(target =>
+    target.removeEventListener(type, listener, options, useCapture)
+  );
+};
+```
+
+```js
+const linkListener = () => console.log('Clicked a link');
+document.querySelector('a').addEventListener('click', linkListener);
+removeEventListenerAll(document.querySelectorAll('a'), 'click', linkListener);
+```