Раскидать чётные и нечётные по разным массивам. Сделал, но может можно как то покороче сделать?

вывод лучше сделать вне цикла, как-то так out1.innerHTML = `a1: [${a1}], a2: [${a2}]`;

Что-то вы, Владимир, долговато топчетесь на задачах уровня пятого класса курса информатики средней школы
<div id="d1"></div>
<script type="text/javascript">
var d = [4,3,7,6];
a1 = [];
a2 = []
for (var i = 0; i <= d.length; i++) {
d[i] % 2 == 0? a1.push(d[i]): a2.push(d[i])
};
d1.innerHTML += a1 + '<br>' + a2;
</script>
Я за ваш срок уже умел хотя бы делать "гистограммы расчета посевной площади сельхозкультур", а у вас всё еще "четные и нечетные числа"...
http://floralib.msk.ru/gisto4.html

Есть куча вариантов) Один из (то же самое можно делать для классического цикла):

https://jsfiddle.net/OPTlMUS/knu3Ljo6/

<div class="out"></div>

let d = [2, 5, -4, 6, 22, -9, -12, 8, 12, 13, 78];
let obj = { a1: [], a2: [] };

for (let x of d) {
  obj[ x % 2 ? "a2" : "a1" ].push( x );
}

let out = document.querySelector('.out');
out.innerHTML = obj.a1.join(", ") + '<br>' + obj.a2.join(", ");
__________________________

В зависимости от деления - берется ключ объекта a1 или a2 - а там оказывается массив, куда и можно добавить элемент. Имхо, красота))

А если поменьше трогать начальные условия, так → https://jsfiddle.net/OPTlMUS/wp1395gt/

https://jsfiddle.net/rjszt9vb/

let fn = ( arr ) => {
let map = [[], []];
arr.forEach(( el ) => {
map[ el & 1 ].push( el );
});
return map;
}

console.log( fn([ 2, 5, -4, 6, 22, -9, -12, 8, 12, 13, 78 ]));