I have a Django template displaying a list of posts and I want to add three dots to each post. When clicked, a popover should appear with clickable options like Delete and Copy Link. To get a better idea of what I'm looking for, you can reference Instagram and Facebook posts. Thank you in advance!
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div></div>
<a href="#" data-toggle="popover" title="Popover Header" data-content="Some content inside the
popover"><span>⋮</span></a>
<style>
span {
content: "\22EE";
}
</style>
<script>
$(document).ready(function(){
$('[data-toggle="popover"]').popover();
});
</script>
I've implemented this code but unfortunately, the options in the popover are not clickable and I am struggling to display more than one option. Can someone help me with this issue?