onclick span not working inside a button

Question

What i want is, when click on (X) inside a button, then it should trigger the respective callback registered. But i dont know why it is failing. Below is what i tried:

HTML

<div id="cover"></div>
<template id='filtertemp'>
                <button id="filtype" class='filbut' data-filter=""></button>
</template>
<button id='create' onclick="filter();">Click</button>

JQUERY

function filter(){
var content= $('#filtertemp')[0].content;
if(content){
    var filType= content.querySelector('#filtype');
    $(filType).text("type : sometype");
    var clone= document.importNode(content,true);
    $('#cover').append($(clone));
    $('#cover > .filbut:last-child').append('<span class="glyphicon glyphicon glyphicon-remove"></span>');
}
$('.glyphicon').on('click', function(){
    alert('Remove');
});
}

Here is the fiddle link: http://jsfiddle.net/wtce6dje/

I tried even below to register listener, but that too dint seemed to work:

$('body').on('click','.glyphicon', function(){
    alert('Remove');
});

Do you need this kind of things http://jsfiddle.net/wtce6dje/1/ — Balachandran, Jun 30 '15 at 10:35
@MilindAnantwar Doesnt work for me..I am using mozilla browser — RAKESH KUMAR, Jun 30 '15 at 11:37
@gmo So if it doesnt works for mozilla, what can be the workaround? — RAKESH KUMAR, Jun 30 '15 at 12:53
Well, that depends, What's the real/initial reason why you're using a button element? And no, there's no workarround, just have to find the right element to use depending on your needs. — gmo, Jun 30 '15 at 20:45

score 2 · Answer 1 · edited Jun 30 '15 at 13:40

2

<button id='create' Onclick="return filter();">Click</button>

edited Jun 30 '15 at 13:40

Ram G Athreya

4,892
6
25
57

answered Jun 30 '15 at 10:44

Hemanth M C

436
1
4
18

score 0 · Answer 2 · answered Jun 30 '15 at 10:46

having a click event within a button works for me in Chrome, but doesn't in the other browsers that I have tested.

It works when it's swapped out with a div:

<template id='filtertemp'>
    <div id="filtype" class='filbut' data-filter=""></div>
</template>

onclick span not working inside a button

2 Answers2