title: Bootstrap dropdown menu not working when i replace a div with html through ajax call
body: <p>Here's my code</p>
  
  <pre><code>&lt;nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"&gt;
      &lt;div class="jumbotron" id="rkhs"&gt;
          &lt;h2 align="right" id="welcome"&gt;Welcome to RKHS Page&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;!-- Brand and toggle get grouped for better mobile display --&gt;
          &lt;div class="navbar-header"&gt;
              &lt;button type="button" class="navbar-toggle" data-toggle="collapse"
                  data-target="#bs-example-navbar-collapse-1"&gt;
                  &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt; &lt;span
                      class="icon-bar"&gt;&lt;/span&gt; &lt;span class="icon-bar"&gt;&lt;/span&gt; &lt;span
                      class="icon-bar"&gt;&lt;/span&gt;
              &lt;/button&gt;
              &lt;a class="navbar-brand" href="homePage.jsp"&gt;Home&lt;/a&gt;
          &lt;/div&gt;
          &lt;!-- Collect the nav links, forms, and other content for toggling --&gt;
          &lt;div class="collapse navbar-collapse"
              id="bs-example-navbar-collapse-1"&gt;
              &lt;ul class="nav navbar-nav"&gt;
                  &lt;li&gt;&lt;a href="#" id="about"&gt;About&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="dropdown"&gt;&lt;a href="#" class=""
                      data-toggle="dropdown" id="adHeading"&gt; Admissions &lt;b
                          class="caret"&gt;&lt;/b&gt;
                  &lt;/a&gt;
                      &lt;ul class="dropdown-menu"&gt;
                          &lt;li&gt;&lt;a href="#" id="admissions"&gt;Admission Details&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" id="admissionsForm"&gt;Admissions Form&lt;/a&gt;&lt;/li&gt;
                      &lt;/ul&gt;&lt;/li&gt;
                  &lt;li class="dropdown"&gt;&lt;a href="#" class="dropdown-toggle"
                      data-toggle="dropdown" role="button" aria-expanded="false"&gt;Dropdown
                          &lt;span class="caret"&gt;&lt;/span&gt;
                  &lt;/a&gt;
                      &lt;ul class="dropdown-menu" role="menu"&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#" id="admissions"&gt;Admissions&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="divider"&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
                          &lt;li class="divider"&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;One more separated link&lt;/a&gt;&lt;/li&gt;
                      &lt;/ul&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="lialign"&gt;&lt;a href="login.jsp"&gt;Login&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;!-- /.navbar-collapse --&gt;
      &lt;/div&gt;
      &lt;!-- /.container --&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>When i click on admissions link it is working. But when i replace the div with id htmlChange with a html through ajax call the admissions dropdown is not working.Initially when the page loads the drop down menu in the nav bar is working fine but if you click on the admissions link through an ajax call div with htmlChange is replaced with the html.after that none of the dropdown is working</p>