[Davydov]

Добрый день !
Кое-что не получается:

HTML:
<input type="color" id="fon_1"/>
<input type="color" id="fon_2"/>


Less:
@main_color_1: red;
@main_color_2: blue;


jQuery:

window.oninput = function oninputColor() {
var idColor1 = document.getElementById('fon_1').value;
less.modifyVars({'@main_color_1':idColor1});
};

window.oninput = function oninputColor() {
var idColor2 = document.getElementById('fon_2').value;
less.modifyVars({'@main_color_2':idColor2});
};

Два изменения цвета работают только по отдельности ! Т.е. в данном варианте работает только 2-й, но если убрать второй - начинает работать первый.

Я пробовал добавить:

$(document).ready(function() {

, но если добавляю к первому - второй не работает,
если к двум, то первый не работает.

Пробовал сделать и так:

window.oninput = function oninputColor() {
var idColor1 = document.getElementById('fon_1').value;
var idColor2 = document.getElementById('fon_2').value;
less.modifyVars({'@main_color_1':idColor1});
less.modifyVars({'@main_color_2':idColor2});
};

, но работает тогда только второй.

Что я сделал не так ?