How to change vue.js variable value with jQuery

Hi everyone,

I have this strange issue. I am making form 2 buttons that gives YES and NO options. Here's my html:

<button class="yes" data-id="1">Yes</button>
<button class="no" data-id="0">No</button>
<input class="option-val" type=""hidden" v-model="status">

Here's my jQuery code

$('button').click(function() {
    $('option-val').val($(this).attr("data-id"));
});

Here's vue.js:

<script>
    export default {
    data: function () {
        return {
            status: 1
        }
    },
        mounted() {
            console.log('Component ready.')
        }
    }
</script>

The problem is if I click a NO button, status value doesnt change to 0. It's still equal to 1. Do you guys know, how can I solve this problem?