Make thumbnails in WC replace the main image instead of opening fancybox

I found this topic online, exactly what i am looking for

https://wordpress.stackexchange.com/questions/83993/make-thumbnails-in-woocommerce-replace-the-main-image-instead-of-opening-fancybo

I really don’t where i have to edit that code.

Where should i put this code

jQuery(document).ready(function($) {
	"use strict";
	$(document).on('click','.thumbnails .zoom', function(){
		var photo_fullsize = $(this).find('img').attr('src').replace('-150x180','');
		$('.woocommerce-main-image img').attr('src', photo_fullsize);
		return false;
	});
});

Here you can see that it works. But how to add it in my child theme?

https://codepen.io/anon/pen/NGPBQM