Method on dynamically loaded chip not working


I am loading deletable chips that have methods attached to it. However, the method @click=“deletePersonalisedTag” does not seem to work/invoked for dynamically loaded chips.

Any advice?

loadPersonalisedTags: function () {
	var self = this;
	var tags = 'PHP,Java,HTML,Ruby,Delphi,C++,VB,GoLang';
	var array_tags = tags.split(",");
	var newChip = (e, i) {
		return '<div class="chip"><div class="chip-label">'+ e +'</div><a href="#" class="chip-delete" @click="deletePersonalisedTag"></a></div>'


After a couple of searches, I came across this in the documentation

Event handlers are processed only on initial rendering, or for elements patched with VDOM. If you add such element to DOM manually it won’t work!

So I rewrote my code and this used this approach

$('#div_personalised_tags').on('click','.my_tag', function (e) {

	//my logic

Works perfectly!