diff --git a/client/src/components/content-blocks/ContentComponent.vue b/client/src/components/content-blocks/ContentComponent.vue
index 553f967b..b3852b5c 100644
--- a/client/src/components/content-blocks/ContentComponent.vue
+++ b/client/src/components/content-blocks/ContentComponent.vue
@@ -148,9 +148,19 @@ const componentClass = computed(() => {
   }
   return classes;
 });
-const paragraphs = computed(() =>
-  contentComponentDiv.value ? contentComponentDiv.value.getElementsByTagName('p') : []
-);
+const paragraphs = computed(() => {
+  if (contentComponentDiv.value) {
+    let elements: HTMLCollection;
+    elements = contentComponentDiv.value.getElementsByTagName('p');
+    if (!elements.length) {
+      const uls = contentComponentDiv.value.getElementsByTagName('ul');
+      const ul = uls[0];
+      elements = ul.getElementsByTagName('li');
+    }
+    return elements;
+  }
+  return [];
+});
 
 watch(
   () => filteredHighlights.value.map((h) => h.color),
diff --git a/client/src/directives/highlight.ts b/client/src/directives/highlight.ts
index 9ab8c1e5..7f277380 100644
--- a/client/src/directives/highlight.ts
+++ b/client/src/directives/highlight.ts
@@ -109,13 +109,14 @@ export const getSelectionHandler =
         if (range.intersectsNode(el)) {
           // the selection is inside our container, so we can do something with it
           const { startContainer, endContainer } = range;
+          // todo: handle case with paragraphs and list items
           const startAncestor = findClosestAncestorWithTag(startContainer, ['p', 'li']);
           // const endAncestor = findClosestAncestorWithTag(endContainer, 'p');
           if (!startAncestor) {
             throw Error('This should not be happening, but there was no paragraph or list item');
           }
           // should have the same tag as the start item
-          const endAncestor = findClosestAncestorWithTag(endContainer, startAncestor.tagName);
+          const endAncestor = findClosestAncestorWithTag(endContainer, startAncestor.tagName.toLowerCase());
 
           if (startAncestor === endAncestor) {
             const contentComponent = findClosestAncestorWithClass(startContainer, 'content-component');