Почему странно работает цикл?
Думаю, не стоит определять функцию во время цикла. Так должно сработать. var _a = document.querySelectorAll('.a'),
      _b = document.querySelectorAll('.b');

function cc(a) {
  console.log(a);
}

for(var i = 0; i < _a.length; i++){
      _a[i].addEventListener('click', cc(_b[i]),false);
      _b[i].addEventListener('click', cc(_b[i]), false);
}
Всё объясню:Как работает код:
Находятся элементы на странице и помещаются в массив x = [0, 1, 2];
Начинается цикл объявлением глобальной переменной i = 0;
Затем идет проверка, и если i < длины массива, то:
1) на div вешается функция слушатель для нажатия с функцией function(){console.log( _x[i] )
2) глобальная переменная i увеличивается на единицу.
Когда i достигает значения больше индексов массива (i = 3, не проходит проверку) цикл прекращается.
Теперь мы наводим курсор на div и кликаем:
Слушатель запускает функцию function(){console.log( _x[i] )
Функция пытается найти i.
Так как внутри функции переменная i не была определена, она обращается к глобальной области видимости.
В глобальной области видимости переменная i == 3, по такому индексу в массиве ничего нет - функция пишет в консоль undefined.Как исправить:
Создать функцию, которая будет создавать функции с определенным индексом и вызывать её в цикле:var _a = document.querySelectorAll('.a'),
      _b = document.querySelectorAll('.b');

function f_console_log_B_for_index(i) {
      return function(){console.log( _b[i] );}
}
function f_console_log_A_for_index(i) {
      return function(){console.log( _a[i] );}
}
for(var i = 0; i < _a.length; i++){
      _a[i].addEventListener('click', f_console_log_A_for_index(i),false);
      _b[i].addEventListener('click', f_console_log_B_for_index(i),false);
}
В такой создаваемой функции значение переменной i будет таким с каким вызвали функцию, создавшую её.
Прочитайте про области видимости и замыкания.