title: Change navbar login dropdown to logout ajax
body: <p>I am trying to figure out how to change a bootstrap navbar dropdown via ajax(without page refresh) after the user logs in. Thanks </p>
  
  <pre><code>&lt;ul class="nav navbar-nav" name= "myNavBar" id="myNavbar"&gt;
      &lt;li&gt;&lt;a href="/about/"&gt;About&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="/contact/"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="/blog/"&gt;Blog&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="/webstore/FiberArts/"&gt;Store&lt;/a&gt;&lt;/li&gt;
      &lt;li class="dropdown"&gt;
          &lt;a class="dropdown-toggle" data-toggle="dropdown" href="#"&gt;Login | Register&lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
          &lt;ul class="dropdown-menu"&gt;
              &lt;li&gt;&lt;a data-toggle="modal" data-target="#myOtherModal" href="#log-in"&gt;Login&lt;/a&gt;&lt;/li&gt;
              &lt;li class="divider"&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a data-toggle="modal" data-target="#myModal" href="#log-in"&gt;Register&lt;/a&gt;&lt;/li&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I can get it to change but it requires page refresh</p>