Using bootstrap 3 I am trying to add a new HTML element into a dynamic popover like
$(document).on('click', '#send-app', function(){ console.log("Clicked!"); $("#result").html('<p>New HTML Element</p>'); });but it is not working! Can you please let me know how to fix this? Thanks
$("[data-toggle=popover]").popover({ html: true, content: function() { return $('#popover-content').html(); } }); $(document).on('click', '#send-app', function(){ console.log("Clicked!"); $("#result").html('<p>New HTML Element</p>'); }); .popover { max-width: 300px; }<div class="container"> <div id="wrap"> <a data-placement="bottom" data-toggle="popover" data-container="body" role="button" data-html="true" href="#" id="login" class="btn btn-default">Send</a> <div id="popover-content" class="hide"> <div class="well well-sm" style="margin-top:16px; padding-top:14px; padding-bottom:0px;"> <div class="row"> <div class="col-md-12"> <div class="form-group"> <div class="input-group"> <input id="email" name="email" class="form-control" placeholder="Email" type="text"> <span class="btn input-group-addon" id="send-app">Send</span> </div> <p class="help-block animated"></p> </div> <div id="result"></div> </div> </div> </div> </div> </div> </div>