diff --git a/frontend/src/main.less b/frontend/src/main.less
index 1082a81c89c6ad5a14c0da5950296a9195d47bd6..f07a833e1f99beae63ded33f2802e9c22899f102 100644
--- a/frontend/src/main.less
+++ b/frontend/src/main.less
@@ -217,6 +217,7 @@ main {
 
 		.preview {
 			width: 15rem;
+			cursor: pointer;
 		}
 
 		img {
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
index 23650e5fde1a929fa2a497f0a619fdb4e486688f..6a987728de755d1826356c93bb8e57640c1028c7 100644
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -1,7 +1,5 @@
 import './main.less';
 
-console.log("Hello World");
-
 function onInputHandler(event: Event) {
 	const preview = document.getElementById('preview') as HTMLIFrameElement;
 	const previewDoc = preview.contentDocument as Document;
@@ -12,9 +10,30 @@ function onInputHandler(event: Event) {
 
 window.addEventListener("load", () => {
 	if (document.getElementById('preview')) {
-		for (let el of document.getElementsByClassName('input-dispatch')) {
+		for (const el of document.getElementsByClassName('input-dispatch')) {
 			console.log(el);
 			el.addEventListener('input', onInputHandler);
 		}
+
+		for (const op of document.querySelectorAll('.option .preview')) {
+			console.log(op);
+			const input_id = (op as HTMLElement).dataset.for;
+			if (!input_id) {
+				console.error("Missing data-for attribute for", op);
+				continue;
+			}
+			const input = document.getElementById(input_id);
+			if (!input || input === null) {
+				console.error("Unable to find input for", op);
+				continue;
+			}
+
+			const handler = (_: Event) => {
+				console.log("clicked");
+				(input as HTMLInputElement).checked = true;
+			};
+			op.addEventListener('click', handler);
+			(op as HTMLIFrameElement).contentDocument?.addEventListener('click', handler);
+		}
 	}
 });
diff --git a/schilder2000/templates/schild.html.j2 b/schilder2000/templates/schild.html.j2
index b13674627c1287290c8d2764be640bb8379298fe..f852e8c802ff3887c1bafc11510906f810ff3178 100644
--- a/schilder2000/templates/schild.html.j2
+++ b/schilder2000/templates/schild.html.j2
@@ -64,6 +64,7 @@
 						class="preview option-border"
 						src="{{ url_for('instance.sample_html', template=t.name) }}"
 						id="template-preview:{{ t.name }}"
+						data-for="template:{{ t.name }}"
 					>
 					</iframe>
 					<label for="template:{{ t.name }}" class="preview-label">