Кирилл Пензин

Здесь разобраны различные средства, которые вам помогут. тык

А плагин для подобых операций TextFX

function addClass() {
  	var id = $(this).attr('href');
  	$("a").removeClass('active');
        $("div").removeClass('active');
  	$(this).addClass('active');
  	$(id).addClass('active');
}

	var nodeList = document.querySelectorAll('a');

	for( var i = 0; i < nodeList.length; i++) {
		nodeList[i].addEventListener('click', addClass);
	}

datepicker

Обращаться к глобальному массиву $_GET или $_POST. Как вы их передаёте? Объектами? Тогда увас, возможно, будет просто массив ассоциативных массивов. Вот и обходите их все как обычный массив.

UPD:

foreach($_POST['data'] as $value) {
   # deal something with this $value
   # $value['first_key'] - обращение к элементу
}

Самый простой путь: подключаете модуль для окон, либо bootstrap сразу. Прописываете необходимые пути в asssets для js и css. После чего просто вызываете и создаёте их. Это второй глупый вопрос от вас. Рекомендую для начала внимательно прочитать гайды по рельсам, чтобы не путать тёплое с мягким. Рельсы это фрэймворк для бэк-энда, ему глубоко и сильно фиолетово, что и как у вас на фронтэнде, пока вы используете допустимый для него стек технологий. По умолчанию на фронт у него доступны HTML, CSS, SCSS, JS, CoffeeScript.

UPD: у вас есть layout-ы: application и иные, которые вы сделаете сами. Для них есть имя_лэйаута.css и имя_лэйаута.js. В них вы должны подключать плагины. Плагины должны быть в соответственных assets(stylesheets or javascripts or images). Для некоторых вещей есть сразу собранные гемы, которы подключать ещё проще. Для bootstrap точно есть.
Плагины лучше всего размещать в отдельных папках и для них дописывать строку:

*= require_tree ./путь_к_директории_плагина в css
//= require_tree ./путь_к_директории_плагина в js

.

Если ваша цель лучше разобраться в программировании, как таковом, то осваивайте алгоритмы и реализуйте их на JS. Есть куча задач на hackerrank, codingame и др. А если более важным является умение практически применять js в различных ситуациях, то это надо изучать стандарты(более глубокое понимание возможностей языка), библиотеки(дабы не изобретать очередной велосипед),фрэймворки и просто различные наработки людей, например, codepen.io , чтобы иметь на вооружении широкий спектр "фишек". Ну, ещё неплохо бы тогда Node.js для бэк-энда. Примерно так может выглядеть путь, если быть именно JS-программистом.

Для начала: не использовать микроскоп вместо молотка. Воткните весь код в такие же файлы через обычный блокнот или просто возьмите их из проекта и запустите default.html в браузере. Да, ещё хотелось бы взглянуть на коды и ссылку на codepen получить. Возможно, вы могли по ошибке воткнуть haml вместо html или SCSS вместо CSS.