Прокрутка списка с прикрепленным заголовком ⇐ Jquery

[Anonymous]

Я пытаюсь создать на веб-странице своего рода список дел, который по сути представляет собой один большой список с задачами, но разделенный по датам.
Чтобы добиться этого, я думал о создании двух столбцов. Слева я хочу показать поля с датой, а в правом столбце я хочу показать список задач.
Я хочу дату в левом столбце, чтобы прокручивать список и привязывать его к первому элементу с этой датой.
Как только он достигнет верхней части страницы (или элемента div), я бы хотелось бы, чтобы он оставался сверху, как липкий заголовок, до тех пор, пока не прокрутится следующее поле даты, чтобы заменить его.
Но как я могу связать эти поля даты с в другом столбце?
Будем признательны за любые советы.
Есть jsfiddle, чтобы показать немного больше того, что я пытаюсь получить : https://jsfiddle.net/jsfnx0yL/1/

Подробнее здесь: https://stackoverflow.com/questions/790 ... cky-header