How to click on two different '<div>' at the same time on mobile devices?

Question

I’m creating a website to play musical notes and for that I need to click multiple buttons (Divs) at the same time, but when I do this nothing happens, only when I click one button. On the computer I could not test because of mouse click, but when I test on the Smartphone the error gets sharper. I believe it may be because of the zoom on mobile devices that need the same clicks. This problem occurs only with the mouse, on the keyboard works normally. keyboard: q...t, a...g, z...b

    function teclasom(id){

        // audio
        let id_audio = $(id).attr('id')
        document.getElementById(id_audio+'audio').load()
        document.getElementById(id_audio+'audio').play()


        // animação
        if($(id).css('transform') == 'matrix(1, 0, 0, 1, 0, 0)'){ // transform: rotateY(180deg)
            $(id).css({
                'transition': '0.3s',
                'transform': 'rotateY(180deg)'
            })
        }else if($(id).css('transform') == 'matrix3d(-1, 0, -1.22465e-16, 0, 0, 1, 0, 0, 1.22465e-16, 0, -1, 0, 0, 0, 0, 1)'){ // transform: rotateY(0deg)
            $(id).css({
                'transition': '0.3s',
                'transform': 'rotateY(0deg)'
            })
        }
    }

$('.botao').on('click', function(){
   teclasom($(this))
})

website link: https://skysongs.000webhostapp.com/