diff --git a/com.woltlab.wcf/templates/birthdaySearchableOptionType.tpl b/com.woltlab.wcf/templates/birthdaySearchableOptionType.tpl
index c38b26355c0..379597d50e5 100644
--- a/com.woltlab.wcf/templates/birthdaySearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/birthdaySearchableOptionType.tpl
@@ -2,7 +2,13 @@
 <input type="number" id="{$option->optionName}_age_to" name="values[{$option->optionName}][ageTo]" value="{$valueAgeTo}" placeholder="{lang}wcf.user.birthday.age.to{/lang}" min="0" max="120" class="tiny">
 
 <script data-relocate="true">
-$(function() {
-	$('#{$option->optionName}').parents('dl:eq(0)').find('> dt > label').text('{jslang}wcf.user.birthday.age{/jslang}');
-});
+	{
+		const input = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (input) {
+			const label = input.closest('dl').querySelector(':scope > dt > label');
+			if (label) {
+				label.textContent = '{jslang}wcf.user.birthday.age{/jslang}';
+			}
+		}
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/integerOptionType.tpl b/com.woltlab.wcf/templates/integerOptionType.tpl
index 96bdc5ee512..05a0faf724c 100644
--- a/com.woltlab.wcf/templates/integerOptionType.tpl
+++ b/com.woltlab.wcf/templates/integerOptionType.tpl
@@ -1 +1 @@
-<input type="number" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $option->minvalue !== null} min="{$option->minvalue}"{/if}{if $option->maxvalue !== null} max="{$option->maxvalue}"{/if}{if $inputClass} class="{@$inputClass}"{/if}{if $option->required} required{/if}>
\ No newline at end of file
+<input type="number" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $option->minvalue !== null} min="{$option->minvalue}"{/if}{if $option->maxvalue !== null} max="{$option->maxvalue}"{/if}{if $inputClass} class="{$inputClass}"{/if}{if $option->required} required{/if}>
diff --git a/com.woltlab.wcf/templates/messageOptionType.tpl b/com.woltlab.wcf/templates/messageOptionType.tpl
index 3647f324626..49cbd5706c3 100644
--- a/com.woltlab.wcf/templates/messageOptionType.tpl
+++ b/com.woltlab.wcf/templates/messageOptionType.tpl
@@ -2,7 +2,13 @@
 {include file='shared_wysiwyg' wysiwygSelector=$option->optionName}
 
 <script data-relocate="true">
-$(function() {
-	$('#{$option->optionName}').parents('dl:eq(0)').addClass('wide');
-});
+	{
+		const textarea = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (textarea) {
+			const dl = textarea.closest('dl');
+			if (dl) {
+				dl.classList.add('wide');
+			}
+		}
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/multiSelectOptionType.tpl b/com.woltlab.wcf/templates/multiSelectOptionType.tpl
index d1faa4ebd3e..ff51d59cb7f 100644
--- a/com.woltlab.wcf/templates/multiSelectOptionType.tpl
+++ b/com.woltlab.wcf/templates/multiSelectOptionType.tpl
@@ -1,5 +1,5 @@
-<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{@$selectOptions|count}{/if}"{if $option->required} required{/if}>
+<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{$selectOptions|count}{/if}"{if $option->required} required{/if}>
 {foreach from=$selectOptions key=key item=selectOption}
-	<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+	<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{$selectOption}{/lang}</option>
 {/foreach}
 </select>
diff --git a/com.woltlab.wcf/templates/multiSelectSearchableOptionType.tpl b/com.woltlab.wcf/templates/multiSelectSearchableOptionType.tpl
index d75a8fdbc5d..e4d9b4b307f 100644
--- a/com.woltlab.wcf/templates/multiSelectSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/multiSelectSearchableOptionType.tpl
@@ -1,19 +1,18 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchRadioButtonOption{/lang}</label>
-<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{@$selectOptions|count}{/if}"{if !$searchOption} disabled{/if}{if $option->required} required{/if}>
+<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{$selectOptions|count}{/if}"{if !$searchOption} disabled{/if}{if $option->required} required{/if}>
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{$selectOption}{/lang}</option>
 	{/foreach}
 </select>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const select = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && select) {
+			checkbox.addEventListener('change', () => {
+				select.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/optionFieldList.tpl b/com.woltlab.wcf/templates/optionFieldList.tpl
index 0a08f6ca2dc..3aed79662ff 100644
--- a/com.woltlab.wcf/templates/optionFieldList.tpl
+++ b/com.woltlab.wcf/templates/optionFieldList.tpl
@@ -15,7 +15,7 @@
 							{icon name='bolt'}
 						</span>
 					{/if}
-					{$langPrefix|concat:$option->optionName|phrase}
+					{lang}{$langPrefix}{$option->optionName}{/lang}
 				</label>
 			{/if}
 		</dt>
@@ -25,11 +25,11 @@
 					{if $error == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}{@$langPrefix}error.{$error}{/lang}
+						{lang}{$langPrefix}error.{$error}{/lang}
 					{/if}
 				</small>
 			{/if}
-			<small>{lang __optional=true}{@$langPrefix}{$option->optionName}.description{/lang}</small>
+			<small>{lang __optional=true}{$langPrefix}{$option->optionName}.description{/lang}</small>
 		</dd>
 	</dl>
 {/foreach}
diff --git a/com.woltlab.wcf/templates/radioButtonOptionType.tpl b/com.woltlab.wcf/templates/radioButtonOptionType.tpl
index 21a53727b61..59ba4b47286 100644
--- a/com.woltlab.wcf/templates/radioButtonOptionType.tpl
+++ b/com.woltlab.wcf/templates/radioButtonOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach name=radioButtons from=$selectOptions key=key item=selectOption}
-	<label><input {if $tpl.foreach.radioButtons.first}id="{$option->optionName}" {/if}type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input {if $tpl.foreach.radioButtons.first}id="{$option->optionName}" {/if}type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
diff --git a/com.woltlab.wcf/templates/selectOptionType.tpl b/com.woltlab.wcf/templates/selectOptionType.tpl
index 7529516b613..0663133f48c 100644
--- a/com.woltlab.wcf/templates/selectOptionType.tpl
+++ b/com.woltlab.wcf/templates/selectOptionType.tpl
@@ -1,6 +1,6 @@
 <select id="{$option->optionName}" name="values[{$option->optionName}]"{if $option->required} required{/if}{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{$selectOption}{/lang}</option>
 	{/foreach}
 </select>
diff --git a/com.woltlab.wcf/templates/selectSearchableOptionType.tpl b/com.woltlab.wcf/templates/selectSearchableOptionType.tpl
index 8903fea1b77..e05649bc5e5 100644
--- a/com.woltlab.wcf/templates/selectSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/selectSearchableOptionType.tpl
@@ -2,19 +2,18 @@
 <select id="{$option->optionName}" name="values[{$option->optionName}]"{if !$searchOption} disabled{/if}{if $option->required} required{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{$selectOption}{/lang}</option>
 	{/foreach}
 </select>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const select = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && select) {
+			checkbox.addEventListener('change', () => {
+				select.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl b/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
index 444649675fa..cf54d52f025 100644
--- a/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_booleanSearchableOptionType.tpl
@@ -11,16 +11,21 @@
 </ol>
 
 <script data-relocate="true">
-	$(function() {
-		$('#search_{$option->optionName}').change(function(event) {
-			if ($(event.currentTarget).prop('checked')) {
-				$('#{$option->optionName}').enable();
-				$('#{$option->optionName}_no').enable();
-			}
-			else {
-				$('#{$option->optionName}').disable();
-				$('#{$option->optionName}_no').disable();
-			}
-		});
-	});
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const radioYes = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		const radioNo = document.getElementById('{unsafe:$option->optionName|encodeJS}_no');
+
+		function setEnabled (enabled) {
+			radioYes.disabled = !enabled;
+			radioNo.disabled = !enabled;
+		}
+
+		if (checkbox) {
+			checkbox.addEventListener('change', (event) => {
+				setEnabled(event.currentTarget.checked);
+			});
+			setEnabled(checkbox.checked);
+		}
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl b/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
index 57dcf08e45f..5d120940385 100644
--- a/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_checkboxesOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
diff --git a/com.woltlab.wcf/templates/shared_checkboxesSearchableOptionType.tpl b/com.woltlab.wcf/templates/shared_checkboxesSearchableOptionType.tpl
index edff6d44e10..918fb016e04 100644
--- a/com.woltlab.wcf/templates/shared_checkboxesSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_checkboxesSearchableOptionType.tpl
@@ -1,17 +1,18 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchRadioButtonOption{/lang}</label>
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if}{if !$searchOption} disabled{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}" {if $key|in_array:$value} checked{/if}{if !$searchOption} disabled{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
 
 <script data-relocate="true">
-	$(function() {
-		$('#search_{$option->optionName}').change(function(event) {
-			if ($(event.currentTarget).prop('checked')) {
-				$('input[name="values[{$option->optionName}][]"]').enable();
-			}
-			else {
-				$('input[name="values[{$option->optionName}][]"]').disable();
-			}
-		});
-	});
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const inputs = document.querySelectorAll('input[name="values[{unsafe:$option->optionName|encodeJS}][]"]');
+		if (checkbox) {
+			checkbox.addEventListener('change', () => {
+				inputs.forEach((input) => {
+					input.disabled = !checkbox.checked;
+				});
+			});
+		}
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/shared_lineBreakSeparatedTextOptionType.tpl b/com.woltlab.wcf/templates/shared_lineBreakSeparatedTextOptionType.tpl
index b4365222809..da13164dd7f 100644
--- a/com.woltlab.wcf/templates/shared_lineBreakSeparatedTextOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_lineBreakSeparatedTextOptionType.tpl
@@ -22,7 +22,7 @@
 		});
 		
 		new UiItemListLineBreakSeparatedText(
-			document.getElementById("lineBreakSeparatedTextOption_{@$identifier|encodeJS}")
+			document.getElementById("lineBreakSeparatedTextOption_{unsafe:$identifier|encodeJS}")
 		);
 	});
 </script>
diff --git a/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl b/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
index 699751c0e28..0947e3d7828 100644
--- a/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/shared_radioButtonSearchableOptionType.tpl
@@ -1,17 +1,18 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchRadioButtonOption{/lang}</label>
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}{if !$searchOption} disabled{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}{if !$searchOption} disabled{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('input[name="values[{$option->optionName}]"]').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const radioInputs = document.querySelectorAll('input[name="values[{unsafe:$option->optionName|encodeJS}]"]');
+		if (checkbox) {
+			checkbox.addEventListener('change', () => {
+				radioInputs.forEach((input) => {
+					input.disabled = !checkbox.checked;
+				});
+			});
 		}
-		else {
-			$('input[name="values[{$option->optionName}]"]').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/textI18nOptionType.tpl b/com.woltlab.wcf/templates/textI18nOptionType.tpl
index 6deed6b0af5..7dc01a5c74f 100644
--- a/com.woltlab.wcf/templates/textI18nOptionType.tpl
+++ b/com.woltlab.wcf/templates/textI18nOptionType.tpl
@@ -1,2 +1,2 @@
-<input type="{@$inputType}" id="{$option->optionName}" name="{$option->optionName}" value="{$i18nPlainValues[$option->optionName]}"{if $option->required} required{/if} class="long">
+<input type="{$inputType}" id="{$option->optionName}" name="{$option->optionName}" value="{$i18nPlainValues[$option->optionName]}"{if $option->required} required{/if} class="long">
 {include file='shared_multipleLanguageInputJavascript' elementIdentifier=$option->optionName forceSelection=false}
diff --git a/com.woltlab.wcf/templates/textSearchableOptionType.tpl b/com.woltlab.wcf/templates/textSearchableOptionType.tpl
index 0d040a4caa1..1ea4054e09c 100644
--- a/com.woltlab.wcf/templates/textSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/textSearchableOptionType.tpl
@@ -1,27 +1,34 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchTextOption{/lang}</label>
-<input type="{@$inputType}" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $inputClass} class="{@$inputClass}"{/if}{if !$searchOption} disabled{/if}{if $option->required} required{/if}>
+<input type="{$inputType}" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $inputClass} class="{$inputClass}"{/if}{if !$searchOption} disabled{/if}{if $option->required} required{/if}>
 
 <script data-relocate="true">
-	$(function() {
-		$('#search_{$option->optionName}').change(function(event) {
-			if ($(event.currentTarget).prop('checked')) {
-				$('#{$option->optionName}').enable();
-				
-				{if $inputType === 'date'}
-					$('#{$option->optionName}DatePicker').enable();
-				{/if}
-			}
-			else {
-				$('#{$option->optionName}').disable();
-				
-				{if $inputType === 'date'}
-					$('#{$option->optionName}DatePicker').disable();
-				{/if}
-			}
-		});
-		
-		{if !$searchOption}
-			$('#{$option->optionName}DatePicker').disable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const inputField = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		{if $inputType === 'date'}
+		const datePicker = document.getElementById('{unsafe:$option->optionName|encodeJS}DatePicker');
 		{/if}
-	});
+
+		if (checkbox) {
+			checkbox.addEventListener('change', () => {
+				if (checkbox.checked) {
+					inputField.disabled = false;
+
+					{if $inputType === 'date'}
+					datePicker.disabled = false;
+					{/if}
+				} else {
+					inputField.disabled = true;
+
+					{if $inputType === 'date'}
+					datePicker.disabled = true;
+					{/if}
+				}
+			});
+		}
+
+		{if !$searchOption && $inputType === 'date'}
+		datePicker.disabled = true;
+		{/if}
+	}
 </script>
diff --git a/com.woltlab.wcf/templates/textareaSearchableOptionType.tpl b/com.woltlab.wcf/templates/textareaSearchableOptionType.tpl
index 9d426336560..d98eb4d79fc 100644
--- a/com.woltlab.wcf/templates/textareaSearchableOptionType.tpl
+++ b/com.woltlab.wcf/templates/textareaSearchableOptionType.tpl
@@ -2,14 +2,13 @@
 <textarea id="{$option->optionName}" name="values[{$option->optionName}]"{if !$searchOption} disabled{/if} cols="40" rows="10"{if $option->required} required{/if}>{$value}</textarea>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const textarea = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && textarea) {
+			checkbox.addEventListener('change', () => {
+				textarea.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/wcfsetup/install/files/acp/templates/__optionRewriteTest.tpl b/wcfsetup/install/files/acp/templates/__optionRewriteTest.tpl
index e14487a430a..4f42e3173f4 100644
--- a/wcfsetup/install/files/acp/templates/__optionRewriteTest.tpl
+++ b/wcfsetup/install/files/acp/templates/__optionRewriteTest.tpl
@@ -33,7 +33,7 @@
 			
 			const apps = new Map(Object.entries({
 				{* this bypasses the route system to force rewritten urls *}
-				{implode from=$rewriteTestApplications item=$rewriteTestApplication}'{$rewriteTestApplication->getPackage()|encodeJS}': '{$__wcf->getPath($rewriteTestApplication->getAbbreviation())}core-rewrite-test/'{/implode}
+				{implode from=$rewriteTestApplications item=$rewriteTestApplication}'{unsafe:$rewriteTestApplication->getPackage()|encodeJS}': '{$__wcf->getPath($rewriteTestApplication->getAbbreviation())}core-rewrite-test/'{/implode}
 			}));
 			
 			AcpUiOptionRewriteTest.init(apps);
diff --git a/wcfsetup/install/files/acp/templates/birthdaySearchableOptionType.tpl b/wcfsetup/install/files/acp/templates/birthdaySearchableOptionType.tpl
index 8dccd6f0deb..4e661619d8c 100644
--- a/wcfsetup/install/files/acp/templates/birthdaySearchableOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/birthdaySearchableOptionType.tpl
@@ -2,7 +2,14 @@
 <input type="number" id="{$option->optionName}_age_to" name="values[{$option->optionName}][ageTo]" value="{$valueAgeTo}" placeholder="{lang}wcf.user.birthday.age.to{/lang}" min="0" max="120" class="tiny">
 
 <script data-relocate="true">
-$(function() {
-	$('#{$option->optionName}_age_from').parents('dl:eq(0)').find('> dt > label').text('{jslang}wcf.user.birthday.age{/jslang}').attr('for', '{$option->optionName}_age_from');
-});
+	{
+		const input = document.getElementById('{unsafe:$option->optionName|encodeJS}_age_from');
+		if (input) {
+			const label = input.closest('dl').querySelector(':scope > dt > label');
+			if (label) {
+				label.textContent = '{jslang}wcf.user.birthday.age{/jslang}';
+				label.setAttribute('for', '{unsafe:$option->optionName|encodeJS}_age_from');
+			}
+		}
+	}
 </script>
diff --git a/wcfsetup/install/files/acp/templates/customOptionAdd.tpl b/wcfsetup/install/files/acp/templates/customOptionAdd.tpl
index 769de689224..e077854ff69 100644
--- a/wcfsetup/install/files/acp/templates/customOptionAdd.tpl
+++ b/wcfsetup/install/files/acp/templates/customOptionAdd.tpl
@@ -1,19 +1,26 @@
 <script data-relocate="true">
-	$(function() {
-		var $optionTypesUsingSelectOptions = [{implode from=$optionTypesUsingSelectOptions item=optionTypeUsingSelectOptions}'{@$optionTypeUsingSelectOptions}'{/implode}];
-		
-		$('#optionType').change(function(event) {
-			var $value = $(event.currentTarget).val();
-			if (WCF.inArray($value, $optionTypesUsingSelectOptions)) {
-				$('#selectOptionsDL').show();
+	require(['WoltLabSuite/Core/Dom/Util'], ({ show, hide }) => {
+		const optionTypesUsingSelectOptions = [{implode from=$optionTypesUsingSelectOptions item=optionTypeUsingSelectOptions}'{unsafe:$optionTypeUsingSelectOptions|encodeJS}'{/implode}];
+
+		const optionTypeSelect = document.getElementById('optionType');
+		const selectOptionsDL = document.getElementById('selectOptionsDL');
+		const validationPatternDL = document.getElementById('validationPatternDL');
+
+		optionTypeSelect.addEventListener('change', () => {
+			const value = optionTypeSelect.value;
+			if (optionTypesUsingSelectOptions.includes(value)) {
+				show(selectOptionsDL);
+			} else {
+				hide(selectOptionsDL);
 			}
-			else {
-				$('#selectOptionsDL').hide();
+
+			if (value === 'boolean') {
+				hide(validationPatternDL);
+			} else {
+				show(validationPatternDL);
 			}
-			
-			window[($value === 'boolean' ? 'elHide' : 'elShow')](elById('validationPatternDL'));
 		});
-		$('#optionType').trigger('change');
+		optionTypeSelect.dispatchEvent(new Event('change'));
 	});
 </script>
 
@@ -27,7 +34,7 @@
 					{if $errorType == 'multilingual'}
 						{lang}wcf.global.form.error.multilingual{/lang}
 					{else}
-						{lang}wcf.acp.customOption.name.error.{@$errorType}{/lang}
+						{lang}wcf.acp.customOption.name.error.{$errorType}{/lang}
 					{/if}
 				</small>
 			{/if}
@@ -44,7 +51,7 @@
 					{if $errorType == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}wcf.acp.customOption.description.error.{@$errorType}{/lang}
+						{lang}wcf.acp.customOption.description.error.{$errorType}{/lang}
 					{/if}
 				</small>
 			{/if}
@@ -85,7 +92,7 @@
 					{if $errorType == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}wcf.acp.customOption.optionType.error.{@$errorType}{/lang}
+						{lang}wcf.acp.customOption.optionType.error.{$errorType}{/lang}
 					{/if}
 				</small>
 			{/if}
@@ -109,7 +116,7 @@
 					{if $errorType == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}wcf.acp.customOption.selectOptions.error.{@$errorType}{/lang}
+						{lang}wcf.acp.customOption.selectOptions.error.{$errorType}{/lang}
 					{/if}
 				</small>
 			{/if}
@@ -126,7 +133,7 @@
 					{if $errorType == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}wcf.acp.customOption.validationPattern.error.{@$errorType}{/lang}
+						{lang}wcf.acp.customOption.validationPattern.error.{$errorType}{/lang}
 					{/if}
 				</small>
 			{/if}
diff --git a/wcfsetup/install/files/acp/templates/integerOptionType.tpl b/wcfsetup/install/files/acp/templates/integerOptionType.tpl
index 2d17d6300be..f6057143a00 100644
--- a/wcfsetup/install/files/acp/templates/integerOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/integerOptionType.tpl
@@ -2,9 +2,9 @@
 	<div class="inputAddon">
 {/if}
 
-<input type="number" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $option->minvalue !== null} min="{$option->minvalue}"{/if}{if $option->maxvalue !== null} max="{$option->maxvalue}"{/if}{if $inputClass} class="{@$inputClass}"{/if}>
+<input type="number" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $option->minvalue !== null} min="{$option->minvalue}"{/if}{if $option->maxvalue !== null} max="{$option->maxvalue}"{/if}{if $inputClass} class="{$inputClass}"{/if}>
 
 {if $option->suffix}
-		<span class="inputSuffix">{lang}wcf.acp.option.suffix.{@$option->suffix}{/lang}</span>
+		<span class="inputSuffix">{lang}wcf.acp.option.suffix.{$option->suffix}{/lang}</span>
 	</div>
-{/if}
\ No newline at end of file
+{/if}
diff --git a/wcfsetup/install/files/acp/templates/multiSelectOptionType.tpl b/wcfsetup/install/files/acp/templates/multiSelectOptionType.tpl
index 94bc74071b1..4485783b30c 100644
--- a/wcfsetup/install/files/acp/templates/multiSelectOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/multiSelectOptionType.tpl
@@ -1,5 +1,5 @@
-<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{@$selectOptions|count}{/if}">
+<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{$selectOptions|count}{/if}">
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{unsafe:$selectOption}{/lang}</option>
 	{/foreach}
 </select>
diff --git a/wcfsetup/install/files/acp/templates/multiSelectSearchableOptionType.tpl b/wcfsetup/install/files/acp/templates/multiSelectSearchableOptionType.tpl
index 9156a224f03..8873f2865de 100644
--- a/wcfsetup/install/files/acp/templates/multiSelectSearchableOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/multiSelectSearchableOptionType.tpl
@@ -1,19 +1,18 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchRadioButtonOption{/lang}</label>
-<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{@$selectOptions|count}{/if}"{if !$searchOption} disabled{/if}>
+<select id="{$option->optionName}" name="values[{$option->optionName}][]" multiple size="{if $selectOptions|count > 10}10{else}{$selectOptions|count}{/if}"{if !$searchOption} disabled{/if}>
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $key|in_array:$value} selected{/if}>{lang}{unsafe:$selectOption}{/lang}</option>
 	{/foreach}
 </select>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const select = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && select) {
+			checkbox.addEventListener('change', () => {
+				select.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/wcfsetup/install/files/acp/templates/option.tpl b/wcfsetup/install/files/acp/templates/option.tpl
index 3ae99a45740..9694633998d 100644
--- a/wcfsetup/install/files/acp/templates/option.tpl
+++ b/wcfsetup/install/files/acp/templates/option.tpl
@@ -72,13 +72,13 @@
 		<nav class="tabMenu">
 			<ul>
 				{foreach from=$optionTree item=categoryLevel1}
-					<li><a href="#category_{$categoryLevel1[object]->categoryName|rawurlencode}" title="{lang}wcf.acp.option.category.{@$categoryLevel1[object]->categoryName}{/lang}">{lang}wcf.acp.option.category.{@$categoryLevel1[object]->categoryName}{/lang}</a></li>
+					<li><a href="#category_{$categoryLevel1[object]->categoryName|rawurlencode}" title="{lang}wcf.acp.option.category.{$categoryLevel1[object]->categoryName}{/lang}">{lang}wcf.acp.option.category.{$categoryLevel1[object]->categoryName}{/lang}</a></li>
 				{/foreach}
 			</ul>
 		</nav>
 		
 		{foreach from=$optionTree item=categoryLevel1}
-			<div id="category_{@$categoryLevel1[object]->categoryName}" class="hidden tabMenuContent">
+			<div id="category_{$categoryLevel1[object]->categoryName}" class="hidden tabMenuContent">
 				{if $categoryLevel1[options]|count}
 					<div class="section">
 						{if $categoryLevel1[object]->categoryName === 'module.development'}
@@ -93,7 +93,7 @@
 					{foreach from=$categoryLevel1[categories] item=categoryLevel2}
 						<section class="section">
 							<header class="sectionHeader">
-								<h2 class="sectionTitle">{lang}wcf.acp.option.category.{@$categoryLevel2[object]->categoryName}{/lang}</h2>
+								<h2 class="sectionTitle">{lang}wcf.acp.option.category.{$categoryLevel2[object]->categoryName}{/lang}</h2>
 								{hascontent}<p class="sectionDescription">{content}{lang __optional=true}wcf.acp.option.category.{$categoryLevel2[object]->categoryName}.description{/lang}{/content}</p>{/hascontent}
 							</header>
 							
diff --git a/wcfsetup/install/files/acp/templates/optionFieldList.tpl b/wcfsetup/install/files/acp/templates/optionFieldList.tpl
index 6f4340f0144..5dd393fb265 100644
--- a/wcfsetup/install/files/acp/templates/optionFieldList.tpl
+++ b/wcfsetup/install/files/acp/templates/optionFieldList.tpl
@@ -21,8 +21,7 @@
 							{icon name='shield-halved'}
 						</span>
 					{/if}
-					
-					{$langPrefix|concat:$option->optionName|phrase}
+					{lang}{$langPrefix}{$option->optionName}{/lang}
 
 					{event name='afterOptionName'}
 				</label>
@@ -34,11 +33,11 @@
 					{if $error == 'empty'}
 						{lang}wcf.global.form.error.empty{/lang}
 					{else}
-						{lang}{@$langPrefix}error.{$error}{/lang}
+						{lang}{$langPrefix}error.{$error}{/lang}
 					{/if}
 				</small>
 			{/if}
-			<small>{lang __optional=true}{@$langPrefix}{$option->optionName}.description{/lang}</small>
+			<small>{lang __optional=true}{$langPrefix}{$option->optionName}.description{/lang}</small>
 		</dd>
 	</dl>
 {/foreach}
diff --git a/wcfsetup/install/files/acp/templates/paymentMethodSelectOptionType.tpl b/wcfsetup/install/files/acp/templates/paymentMethodSelectOptionType.tpl
index 773bbc14c57..40e18857d8d 100644
--- a/wcfsetup/install/files/acp/templates/paymentMethodSelectOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/paymentMethodSelectOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}"{if $key|in_array:$value} checked{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="checkbox" name="values[{$option->optionName}][]" value="{$key}"{if $key|in_array:$value} checked{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
diff --git a/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl b/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
index 97ab266d394..c505bf12b44 100644
--- a/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/radioButtonOptionType.tpl
@@ -1,3 +1,3 @@
 {foreach from=$selectOptions key=key item=selectOption}
-	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{@$selectOption}{/lang}</label>
+	<label><input type="radio" name="values[{$option->optionName}]" value="{$key}" {if $value == $key} checked{/if} {if $disableOptions[$key]|isset || $enableOptions[$key]|isset}class="jsEnablesOptions" data-disable-options="[ {$disableOptions[$key]}]" data-enable-options="[ {$enableOptions[$key]}]"{/if}> {lang}{$selectOption}{/lang}</label>
 {/foreach}
diff --git a/wcfsetup/install/files/acp/templates/selectOptionType.tpl b/wcfsetup/install/files/acp/templates/selectOptionType.tpl
index 60dc8b423da..d1aa73bf38c 100644
--- a/wcfsetup/install/files/acp/templates/selectOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/selectOptionType.tpl
@@ -1,6 +1,6 @@
 <select id="{$option->optionName}" name="values[{$option->optionName}]"{if $disableOptions || $enableOptions} class="jsEnablesOptions" data-is-boolean="true" data-disable-options="[ {$disableOptions}]" data-enable-options="[ {$enableOptions}]"{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{$selectOption}{/lang}</option>
 	{/foreach}
 </select>
diff --git a/wcfsetup/install/files/acp/templates/selectSearchableOptionType.tpl b/wcfsetup/install/files/acp/templates/selectSearchableOptionType.tpl
index aa0231557ee..3733050f05e 100644
--- a/wcfsetup/install/files/acp/templates/selectSearchableOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/selectSearchableOptionType.tpl
@@ -2,19 +2,18 @@
 <select id="{$option->optionName}" name="values[{$option->optionName}]"{if !$searchOption} disabled{/if}>
 	{if !$allowEmptyValue|empty}<option value="">{lang}wcf.global.noSelection{/lang}</option>{/if}
 	{foreach from=$selectOptions key=key item=selectOption}
-		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{@$selectOption}{/lang}</option>
+		<option value="{$key}"{if $value == $key} selected{/if}>{lang}{$selectOption}{/lang}</option>
 	{/foreach}
 </select>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const select = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && select) {
+			checkbox.addEventListener('change', () => {
+				select.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>
diff --git a/wcfsetup/install/files/acp/templates/textI18nOptionType.tpl b/wcfsetup/install/files/acp/templates/textI18nOptionType.tpl
index 50e1a616df0..ba7a4514d4c 100644
--- a/wcfsetup/install/files/acp/templates/textI18nOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/textI18nOptionType.tpl
@@ -1,2 +1,2 @@
-<input type="{@$inputType}" id="{$option->optionName}" name="{$option->optionName}" value="{$i18nPlainValues[$option->optionName]}" class="long">
+<input type="{$inputType}" id="{$option->optionName}" name="{$option->optionName}" value="{$i18nPlainValues[$option->optionName]}" class="long">
 {include file='shared_multipleLanguageInputJavascript' elementIdentifier=$option->optionName forceSelection=$option->requireI18n}
diff --git a/wcfsetup/install/files/acp/templates/textSearchableOptionType.tpl b/wcfsetup/install/files/acp/templates/textSearchableOptionType.tpl
index a2b935bd15b..e458fbd6e60 100644
--- a/wcfsetup/install/files/acp/templates/textSearchableOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/textSearchableOptionType.tpl
@@ -1,27 +1,34 @@
 <label><input type="checkbox" id="search_{$option->optionName}" name="searchOptions[{$option->optionName}]"{if $searchOption} checked{/if}> {lang}wcf.user.option.searchTextOption{/lang}</label>
-<input type="{@$inputType}" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $inputClass} class="{@$inputClass}"{/if}{if !$searchOption} disabled{/if}>
+<input type="{$inputType}" id="{$option->optionName}" name="values[{$option->optionName}]" value="{$value}"{if $inputClass} class="{$inputClass}"{/if}{if !$searchOption} disabled{/if}>
 
 <script data-relocate="true">
-	$(function() {
-		$('#search_{$option->optionName}').change(function(event) {
-			if ($(event.currentTarget).prop('checked')) {
-				$('#{$option->optionName}').enable();
-				
-				{if $inputType === 'date'}
-					$('#{$option->optionName}DatePicker').enable();
-				{/if}
-			}
-			else {
-				$('#{$option->optionName}').disable();
-				
-				{if $inputType === 'date'}
-					$('#{$option->optionName}DatePicker').disable();
-				{/if}
-			}
-		});
-		
-		{if !$searchOption}
-			$('#{$option->optionName}DatePicker').disable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const inputField = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		{if $inputType === 'date'}
+		const datePicker = document.getElementById('{unsafe:$option->optionName|encodeJS}DatePicker');
 		{/if}
-	});
+
+		if (checkbox) {
+			checkbox.addEventListener('change', () => {
+				if (checkbox.checked) {
+					inputField.disabled = false;
+
+					{if $inputType === 'date'}
+					datePicker.disabled = false;
+					{/if}
+				} else {
+					inputField.disabled = true;
+
+					{if $inputType === 'date'}
+					datePicker.disabled = true;
+					{/if}
+				}
+			});
+		}
+
+		{if !$searchOption && $inputType === 'date'}
+		datePicker.disabled = true;
+		{/if}
+	}
 </script>
diff --git a/wcfsetup/install/files/acp/templates/textareaSearchableOptionType.tpl b/wcfsetup/install/files/acp/templates/textareaSearchableOptionType.tpl
index 1be0468e541..6c825ea8e70 100644
--- a/wcfsetup/install/files/acp/templates/textareaSearchableOptionType.tpl
+++ b/wcfsetup/install/files/acp/templates/textareaSearchableOptionType.tpl
@@ -2,14 +2,13 @@
 <textarea id="{$option->optionName}" name="values[{$option->optionName}]"{if !$searchOption} disabled{/if} cols="40" rows="10">{$value}</textarea>
 
 <script data-relocate="true">
-$(function() {
-	$('#search_{$option->optionName}').change(function(event) {
-		if ($(event.currentTarget).prop('checked')) {
-			$('#{$option->optionName}').enable();
+	{
+		const checkbox = document.getElementById('search_{unsafe:$option->optionName|encodeJS}');
+		const textarea = document.getElementById('{unsafe:$option->optionName|encodeJS}');
+		if (checkbox && textarea) {
+			checkbox.addEventListener('change', () => {
+				textarea.disabled = !checkbox.checked;
+			});
 		}
-		else {
-			$('#{$option->optionName}').disable();
-		}
-	});
-});
+	}
 </script>