dropdown menu not working on mobile, document click not triggered

Question

I made a simple dropdown menu where it toggle on .dropdown-toggle click and close on .dropdown-toggle and document click. Everything works great on desktop. However it doesn't works on mobile when you try to close the dropdown menu by clicking on the document.

jquery

$('.dropdown-toggle').click(function(event){
    event.stopPropagation();
     $(".dropdown-menu").toggle();
});
$(".dropdown-menu").on("click", function (event) {
    event.stopPropagation();
});

$(document).on("click", function () {
$(".dropdown-menu").hide();
});

any help?