vue jquery id confusion

_.js

// vue jquery id confusion
//
// in a template taking prop 'button_id'
// bound with: v-bind:id=button_id (or v-bind="{id:button_id}")

this.$props.button_id
//    "#button1"

$(event.target).prop('id')
//    "#button1"   

$('#button1').prop('id')
//    undefined
//    WHAT? It can't find #button1.

document.getElementById('#button1');
//    <button id=?"#button1" class=?"main_button">?hey?</button>?
//    Found it, but what are the question marks about?

$(document.getElementById('#button1')).prop('id');
//    "#button1"
//    ...

$('#button1').prop('id');
//    undefined