Swiping issues on Horizontal Scroll inside swipeable tabs

Questions
1

I have created a horizontal scroll inside a swipeable tab. Swiping the horizontal scroll to the left swipes the tab rather than the items in the horizontal scroll.
I then decided to disable the swipe functionality of the tab on touchstart event and then enable it on touchend event (on the horizontal scroll div) but not working. Code below:

$(document).on('touchstart', '.horizontal-scroll-container', function(){
	$('#products-tab').addClass('swiper-no-swiping')
})

$(document).on('touchend', '.horizontal-scroll-container', function(){
	$('#products-tab').removeClass('swiper-no-swiping')
})

The event gets fired alright and swiper-no-swiping class successfully applied to #products-tab, but the tab still swipes instead of the items in the horizontal scroll. Any help please?