Embeded Jquery events in the grapesjs editor not working as expected.

@artf , I tried to embed my template into the grapesjs editor. The issue am getting is the editor not working as expected with that template. Note: Am using react app for wrapping the grapesjs editor.

Initially the editor embeded my template and it is look like below image

I used Parallax effects for my template. The issue is when I click first time on the navigation bar, it reacts differently and load one more editor iniside the existing editor.

The error is: Uncaught TypeError: Cannot read property '_cash1537883139698' of undefined -- grapesjs:6506

the below javascript code using inside the editor:

<script type="text/javascript">	
		$(document).ready(function () {
			/*
			* Plugin intialization
			*/
			$('#pagepiling').pagepiling({
				menu: '#menu',
				anchors: ['VP', 'about', 'insurances-accepted', 'specialties', 'patient-reviews', 'contact'],
				sectionsColor: ['#fff', '#fff', '#fff', '#fff', '#fff', '#fff'],
				navigation: {
					'position': 'left',					
				},
				afterRender: function () {

					$('#pp-nav').addClass('custom');
				},
				afterLoad: function (anchorLink, index) {
					$("#title").text(anchorLink);
					if (index > 1) {
						$('#pp-nav').removeClass('custom');
					} else {
						$('#pp-nav').addClass('custom');
					}
				},
			});
			$('#toggle').click(function () {
			$(this).toggleClass('active');
			$('#overlay').toggleClass('open');
			});
		});

	</script>