I have an icon within a bootstrap popover that I would like to click on and then access the text within the popover (Example: title or content - presumably accessed by class) but can't seem to get it working.
//HTML
<a class="popover-markup" data-toggle="popover" data-placement="bottom" href="#" style="text-align:center;" data-title="title <i class='material-icons ear' >hearing</i>" data-content="content"> 毎日 </a>
//script
$(function () {
$('[data-toggle="popover"]').popover({html: true})
})
$(document).ready(function() {
$(".ear").click( function() {
console.log("ear clicked");
var text = $(this).text();
});
});
I tried an onclick='tts(this)'
within the element which got if firing but then couldn't access 'this', but this didn't seem like way to go anyway.
Thanks
UPDATE Following the advice regarding event delegation I tried this but still not working?
$( "a" ).on( "click", ".ear", function( event ) {
console.log( $( this ).text() );
});