diff --git a/.vscode/settings.json b/.vscode/settings.json
index 568d0f3..616f160 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,6 +1,7 @@
 {
   "cSpell.words": [
     "Dynatos",
+    "itertools",
     "popstate",
     "unsize"
   ],
diff --git a/Cargo.lock b/Cargo.lock
index 892baa8..ed77eae 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -61,7 +61,9 @@ version = "0.1.0"
 dependencies = [
  "duplicate",
  "extend",
+ "itertools",
  "js-sys",
+ "tracing",
  "wasm-bindgen",
  "web-sys",
 ]
@@ -114,6 +116,12 @@ dependencies = [
  "web-sys",
 ]
 
+[[package]]
+name = "either"
+version = "1.9.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a26ae43d7bcc3b814de94796a5e736d4029efb0ee900c12e2d54c993ad1a1e07"
+
 [[package]]
 name = "extend"
 version = "1.2.0"
@@ -150,6 +158,15 @@ dependencies = [
  "unicode-normalization",
 ]
 
+[[package]]
+name = "itertools"
+version = "0.12.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ba291022dbbd398a455acf126c1e341954079855bc60dfdda641363bd6922569"
+dependencies = [
+ "either",
+]
+
 [[package]]
 name = "js-sys"
 version = "0.3.67"
diff --git a/Cargo.toml b/Cargo.toml
index 495d60e..1ccd33e 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -25,6 +25,7 @@ dynatos-util = { path = "dynatos-util" }
 anyhow = "1.0.79"
 duplicate = "1.0.0"
 extend = "1.2.0"
+itertools = "0.12.1"
 js-sys = "0.3.67"
 tracing = "0.1.40"
 tracing-subscriber = "0.3.18"
diff --git a/dynatos-html/Cargo.toml b/dynatos-html/Cargo.toml
index 5399535..cff9704 100644
--- a/dynatos-html/Cargo.toml
+++ b/dynatos-html/Cargo.toml
@@ -7,6 +7,8 @@ edition = "2021"
 
 duplicate = { workspace = true }
 extend = { workspace = true }
+itertools = { workspace = true }
 js-sys = { workspace = true }
+tracing = { workspace = true }
 wasm-bindgen = { workspace = true }
 web-sys = { workspace = true }
diff --git a/dynatos-html/src/lib.rs b/dynatos-html/src/lib.rs
index 3acb09c..a450dbb 100644
--- a/dynatos-html/src/lib.rs
+++ b/dynatos-html/src/lib.rs
@@ -7,7 +7,7 @@
 pub mod html;
 
 // Imports
-use wasm_bindgen::JsValue;
+use {itertools::Itertools, wasm_bindgen::JsValue};
 
 /// Extension trait to set the text content in a builder-style.
 #[extend::ext_sized(name = NodeWithTextContent)]
@@ -152,3 +152,36 @@ where
 			.map(|()| self)
 	}
 }
+
+/// Extension trait to *append* a class in a builder-style.
+#[extend::ext_sized(name = ElementWithClass)]
+pub impl<T> T
+where
+	T: AsRef<web_sys::Element>,
+{
+	fn with_class<C>(self, class: C) -> Self
+	where
+		C: AsRef<str>,
+	{
+		self.with_classes([class])
+	}
+
+	fn with_classes<I, C>(self, classes: I) -> Self
+	where
+		I: IntoIterator<Item = C>,
+		C: AsRef<str>,
+	{
+		// Append all classes to the existing class name and set it.
+		// TODO: Not allocate the classes here.
+		let classes = classes.into_iter().collect::<Vec<_>>();
+		let class_name = self
+			.as_ref()
+			.class_name()
+			.split_whitespace()
+			.chain(classes.iter().map(C::as_ref))
+			.join(" ");
+
+		self.as_ref().set_class_name(&class_name);
+		self
+	}
+}
diff --git a/examples/Cargo.lock b/examples/Cargo.lock
index 4f61491..475d75c 100644
--- a/examples/Cargo.lock
+++ b/examples/Cargo.lock
@@ -88,7 +88,9 @@ version = "0.1.0"
 dependencies = [
  "duplicate",
  "extend",
+ "itertools",
  "js-sys",
+ "tracing",
  "wasm-bindgen",
  "web-sys",
 ]
@@ -141,6 +143,12 @@ dependencies = [
  "web-sys",
 ]
 
+[[package]]
+name = "either"
+version = "1.9.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a26ae43d7bcc3b814de94796a5e736d4029efb0ee900c12e2d54c993ad1a1e07"
+
 [[package]]
 name = "extend"
 version = "1.2.0"
@@ -177,6 +185,15 @@ dependencies = [
  "unicode-normalization",
 ]
 
+[[package]]
+name = "itertools"
+version = "0.12.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ba291022dbbd398a455acf126c1e341954079855bc60dfdda641363bd6922569"
+dependencies = [
+ "either",
+]
+
 [[package]]
 name = "js-sys"
 version = "0.3.67"