How to resolve conflict between bootstrap.js and onclick script?

Question

JavaScript

I have bootstrap.min.js connected
Up to a certain point, there was no conflict, after adding the following script to the code, everything started to work:

$('.country').on('click', function () {
        let country = $( this ).data('country');
        console.log("страна " + country);
    })

I tried this option:

$('.country').on('click', function (e) {
        e.prevebtDefault
        let country = $( this ).data('country');
        console.log("страна " + country);
    })

The result is null. It only works when bootstrap is disabled, but then some functions stop working, in particular, switching tabs and the button block. The conflict needs to be resolved.

Answer 1

e.prevebtDefault is a bug here. e.preventDefault should be written