Eugene Mosyukov

Вы в селекторе потеряли #, исправьте на:
document.querySelector('#result')

На гитхабе можно найти много списков с разной доп. информацией и разной степень актуальности, например:
https://github.com/pensnarik/russian-cities

Как-нибудь так:

<div class="block">
	<div class="block__slide"></div>
	<div class="block__modal">Контент-1</div>
</div>
<div class="block">
	<div class="block__slide"></div>
	<div class="block__modal">Контент-2</div>
</div>

$("body").on('click', '.block__slide', function(){
	$(this).parent('.block').find('.block__modal')
		.fadeIn("slow")
		.css({display: "flex"});
});

<div onclick="func_a()">
    <div onclick="func_b(event)"></div>
</div>
<script type="text/javascript">
    function func_a() {
        alert('a');
    }
    function func_b(e) {
        e.stopPropagation();
        e.cancelBubble = true; // для IE
        alert('b');
    }
</script>

Читать подробнее:
— https://developer.mozilla.org/en-US/docs/Web/API/E...
— https://msdn.microsoft.com/en-us/library/ms533545(...

Не самое элегантное, но зато очень просто решение — записывать состояние в <input type="hidden" />.

1. При смене дня недели в календаре, записать номер дня недели в это скрытое поле.
2. Во время загрузки страницы, проверять заполнено ли это поле. И, если заполнено, то в соответствии с его содержимым восстановить состояние страницы. Но, если поле пустое, — считаем, что пользователь зашел на страницу в первый раз.

Принцип основывается на том, что поля восстанавливают свое содержание, когда пользователь нажимает кнопку назад. В современных браузерах работать будет, под IE у меня нет возможности проверить.

1. Тянулось бы довольно странно. Вы задаете margin, который высчитывает расстояние относительно ширины .container. Получается, чем больше элементов в списке, тем больше между ними расстояние.

2. Так как в качестве размера отступов используются проценты, то для начала браузер высчитывает размер блока .container. После того, как становится известна ширина контейнера, браузер может высчитать проценты от контейнера и применить их в качестве отступов для .sep:after, и разумеется, такой блок уже не помещается, так как при первоначальном просчете не учитывался отступ.

В данной ситуации, как «грязное» решение, можно задать для ul — width: 109%. Тем самым мы компенсируем то, что ширины контейнера недостаточно. Либо задайте для ul — white-space: nowrap. Но это плохие решение. Попробуйте подобрать решение, где вам подойдет фиксированная ширина контейнера.