jquery - Click event not executed on bootstrap dropdown list item link click -


i have multiple dropdowns (more 10), , click method never executes... possible define same click method dropdown elements have done below?

js

<link rel="stylesheet" href="scripts/bootstrap/css/bootstrap.min.css" /> <script src="scripts/jquery-2.1.0.min.js"></script> <script src="scripts/bootstrap/js/bootstrap.min.js"></script> <script type="text/javascript">      $(document).ready(function () {          $(".dropdown-menu li a").click(function () {              console.log("inside"); //this never executes...              var type = $(this).data("type");             var nick = $(this).data("nickname");              if (type == "1") {                 $('#chat_text').val('!tip ' + nick + ' ').focus();             }             else if (type == "2") {              }             else if (type == "3") {                 var val = $('#chat_text').val();                 $('#chat_text').val(val + nick ).focus();             }         });     }); </script> 

html

<li class="dropdown">    <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">test1</a>    <ul class="dropdown-menu" role="menu">     <li><a href="#" data-type="1" data-nickname="test1">tip</a></li>     <li><a href="#" data-type="2" data-nickname="test1">show</a></li>     <li><a href="#" data-type="3" data-nickname="test1">paste</a></li>     </ul>     <span>some text</span> </li>  <li class="dropdown">    <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">test2</a>    <ul class="dropdown-menu" role="menu">     <li><a href="#" data-type="1" data-nickname="test2">tip</a></li>     <li><a href="#" data-type="2" data-nickname="test2">show</a></li>     <li><a href="#" data-type="3" data-nickname="test2">paste</a></li>     </ul>     <span>some text</span> </li> 

more of dropdowns in real code....

*edit: forgot mention add these dropdowns dynamically after page created (ajax calls....)

if add them dynamicly, try this:

$("body").on('click', '.dropdown-menu li a', function () { 

instead of

$(".dropdown-menu li a").click(function () { 

with change click handler there every anchor element within dropdown-menu class, no matter when created.


Comments