Como rolar dois elementos div ao mesmo tempo

Eu quero rolar duas div ao mesmo tempo, e as divs estão em uma caixa de diálogo jquery ui. Quero detectar o evento de rolagem e, em seguida, rolá-los ao mesmo tempo. mas falho no primeiro passo. o html da caixa de diálogo é:

<div>
    <div id="div1" style="width=3px; overflow-x:scroll;">hello, world ...</div>
    <div id="div2" style="width=3px; overflow-x:scroll;">hello, world ...</div>
</div>

o diálogo js é:

$(ret).dialog({
    width: 100,
    height: 120
});

o conteúdo de ret é o html da caixa de diálogo, e eu o obtenho usando .ajax ().

a função de rolagem é:

$(document).on('scroll', 'div[id=1]', function() { alert("get it!"); }

infelizmente, a função de rolagem não funciona. no entanto, funciona se eu alterar 'rolar' para 'clicar'. Eu não sei porque, você poderia me ajudar? obrigado!

$(document).on('click', 'div[id=1]', function() { alert("get it!"); }

questionAnswers(1)

yourAnswerToTheQuestion