         startTime (:startTime modulesMapLesson)
         endTime   (:endTime modulesMapLesson)
         slotsOcc  (- endTime startTime)
-        $divElem  ($ "<div />" (js-obj "class" "lesson"))
+        venue     (:venue modulesMapLesson)
 
         [hourClass minuteClass]
-        (get-css-hour-minute-classes-for-time startTime)]
+        (get-css-hour-minute-classes-for-time startTime)
+
+        $divElem
+        (create-lesson-div :moduleCode moduleCode, :moduleName moduleName,
+                           :lessonType lessonType, :lessonGroup lessonLabel,
+                           :venue venue, :slotsOcc slotsOcc,
+                           :bgColorCssClass bgColorCssClass,
+                           :isActuallySelected? isActuallySelected?)]
     ; Create new row if necessary
     (if (= rowNum (get-nr-rows-in-timetable-day day))
         (add-new-row-to-timetable-day! day))

                            :endTime endTime}
                           $divElem)

    ; add background color css class
    (.addClass $divElem bgColorCssClass)
    (.append $divElem (text ($ "<p />") (str moduleCode " " moduleName)))
    (.append $divElem (text ($ "<p />") (str lessonType " [" lessonLabel "]")))
    (.append $divElem (text ($ "<p />") (:venue modulesMapLesson)))
    (width $divElem (str (* half-hour-pixels slotsOcc) "px"))
    ; make the <div> less opaque for a lesson added by jQuery UI draggable
    (if (not isActuallySelected?)
        (.addClass $divElem "lesson-droppable-not-hover"))
    (let [dayHTMLElem (nth HTML-Timetable day)
          rowHTMLElem (nth (children dayHTMLElem "tr") rowNum)
          tdHTMLElem  (nth (children

      (doseq [siblingTdElem (take (- slotsOcc 1) (.nextAll tdHTMLElem))]
        (.remove siblingTdElem))

      {:day day, :rowNum rowNum, :startTime startTime, :endTime endTime,
       :moduleCode moduleCode, :lessonType lessonType, :lessonGroup lessonLabel,
       :divElem $divElem})))
