Index: lams_central/web/comments/anonymouscheckbox.jsp
===================================================================
diff -u -r7475d08afc280b5e2e5ddf04e8bf35e3166aaf80 -rf14a45648947b8813b4b99842665fcf87f5dfbed
--- lams_central/web/comments/anonymouscheckbox.jsp	(.../anonymouscheckbox.jsp)	(revision 7475d08afc280b5e2e5ddf04e8bf35e3166aaf80)
+++ lams_central/web/comments/anonymouscheckbox.jsp	(.../anonymouscheckbox.jsp)	(revision f14a45648947b8813b4b99842665fcf87f5dfbed)
@@ -1,23 +1,35 @@
-	<c:choose>
+<script type="text/javascript">
+	$(document).ready(function() {
+		$('[data-bs-toggle="popover"]').each((i, el) => {
+			new bootstrap.Popover($(el), {
+				content: '<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.anonymous.tooltip"/></spring:escapeBody>'
+			})
+		});
+	});
+</script>
+
+<c:choose>
 	<c:when test="${sessionMap.mode == 'teacher'}">
 		<%-- include the value so it gets returned but do not allow it to be edited --%>
-		<input type="hidden" id="${anonymousCheckboxName}" name="${anonymousCheckboxName}" value="${anonymousCheckboxChecked ? 'true' : 'false'}"/>
+		<input type="hidden" id="${anonymousCheckboxName}" name="${anonymousCheckboxName}"
+			value="${anonymousCheckboxChecked ? 'true' : 'false'}"
+		/>
 	</c:when>
 
 	<c:otherwise>
-		<div class="checkbox form-control-inline">
-		<label for="${anonymousCheckboxName}">
-		<input type="checkbox" id="${anonymousCheckboxName}" name="${anonymousCheckboxName}" value="true" ${anonymousCheckboxChecked ? 'checked="checked"' : ''}><fmt:message key="label.post.anonomously" />
-		</label>
-		</div>&nbsp;<a tabindex="0" role="button" data-toggle="popover"><i class="fa fa-info-circle"></i></a>
- 		<%-- Use c:out to escape any quotes in the I18N string. Then use html: true converts any escaped quotes back --%>
-		<%-- into real quotes. Should be safe from XSS attack as the string is coming from a translation file. --%>	
-		<fmt:message key="label.anonymous.tooltip" var="ANONYMOUS_TOOLTIP_VAR"></fmt:message>		
- 		<script type="text/javascript">
-		$(document).ready(function() {
-			var ANONYMOUS_TOOLTIP = '<c:out value="${ANONYMOUS_TOOLTIP_VAR}" />';
-	    		$('[data-toggle="popover"]').popover({title: "", content: ANONYMOUS_TOOLTIP, placement:"auto right", delay: 50, trigger:"hover focus", html: true});
-		});
-		</script>
+		<div class="form-check form-check-reverse mt-2">
+			<input type="checkbox" id="${anonymousCheckboxName}" class="form-check-input"
+				name="${anonymousCheckboxName}" value="true" ${anonymousCheckboxChecked ? 'checked="checked"' : ''}
+				aria-description='<spring:escapeBody javaScriptEscape="true"><fmt:message key="label.anonymous.tooltip"/></spring:escapeBody>'
+			>
+				
+			<label for="${anonymousCheckboxName}" class="form-check-label">
+				<fmt:message key="label.post.anonomously" />
+			</label>
+
+			<span data-bs-toggle="popover" data-bs-placement="right" data-bs-trigger="hover focus" aria-hidden="true">
+	  			<i class="fa fa-info-circle"></i>
+			</span>
+		</div>
 	</c:otherwise>
-	</c:choose>
+</c:choose>