Problems with touchstart event

Question

I'm building a dynamic section on a website. When you click or touch the name of one activity, a pop-up displays with the name of that activity and some information. I've used vanilla JS with one click event and one touchstart event. It works fine on the first touch but then, when you change to another activity things go wrong. You can check it here going from one activity to another.

www.altraves.es/navega

function change2h () {
    activity.innerHTML = "<h2>Navega 2 horas</h2>";
    titleDesc.innerHTML = "<div class='et_pb_text_inner'><p>Description of the activity</p></div>"
    form.value = '0';
    finalPrice.innerHTML = 0+'€';

    calcPrice();
    limitAct();

};

titleTwo.addEventListener('click', change2h);
titleTwo.addEventListener('touchstart', change2h);

Could you please help me? thanks!!

Answer 1

I think that I've fixed it adding preventdefault... Could it be?

function change2h (e) {
    e.preventDefault();

    activity.innerHTML = "<h2>Navega 2 horas</h2>";
    titleDesc.innerHTML = "<div class='et_pb_text_inner'><p>Descripción de la actividad</p></div>"
    form.value = '0';
    finalPrice.innerHTML = 0+'€';

    calcPrice();
    limitAct();

};