title: Add link panel tabs in Shiny with various top level navigation bars
body: <p>I'm trying to create links withing navbar in a Shiny app. I found the following code at <a href="https://gist.github.com/xiaodaigh/6445698" rel="nofollow">A gist of programatically changing panel tabs in Shiny</a>. It works great for the first navigation panel, but for the second it doesn't work. Here is my <code>ui.R</code>:</p>
  
  <pre><code>require(shiny)
  
  
  shinyUI(navbarPage("",
                     tabPanel("Foo",
                              tabsetPanel(
                                tabPanel("Foo1",                            
                                         sidebarLayout(
                                           sidebarPanel(
                                             tags$div(div(id="Foo2", tags$a("Foo2"))
                                             )
                                               ),
                                           mainPanel(p("hello Foo1"))
                                )),
                                tabPanel("Foo2",
                                         sidebarLayout(
                                           sidebarPanel(),
                                           mainPanel(p("hello Foo2"))), 
                                           HTML("&lt;script&gt;$('#Foo2').click(function() {
                                                          tabs = $('.tabbable .nav.nav-tabs li')
                                                           tabs.each(function() {
                                                              $(this).removeClass('active')
                                                           })
                                                           $(tabs[1]).addClass('active')
  
                                                           tabsContents = $('.tabbable .tab-content .tab-pane')
                                                           tabsContents.each(function() {
                                                              $(this).removeClass('active')
                                                           })
                                                           $(tabsContents[1]).addClass('active')
  
                                                          $('#Foo2').trigger('change').trigger('shown');
  
                                                       })&lt;/script&gt;")
                                         )
                                )
                                  ),
                     tabPanel("Bar",
                              tabsetPanel(
                                tabPanel("Bar1",                            
                                         sidebarLayout(
                                           sidebarPanel(
                                             tags$div(div(id="Bar2", tags$a("Bar2"))
                                             )
                                           ),
                                           mainPanel(p("hello Bar1"))
                                         )),
                                tabPanel("Bar2",
                                         sidebarLayout(
                                           sidebarPanel(),
                                           mainPanel(p("hello Bar2"))), 
                                         HTML("&lt;script&gt;$('#Bar2').click(function() {
                                                          tabs = $('.tabbable .nav.nav-tabs li')
                                                           tabs.each(function() {
                                                              $(this).removeClass('active')
                                                           })
                                                           $(tabs[1]).addClass('active')
  
                                                           tabsContents = $('.tabbable .tab-content .tab-pane')
                                                           tabsContents.each(function() {
                                                              $(this).removeClass('active')
                                                           })
                                                           $(tabsContents[1]).addClass('active')
  
                                                          $('#Bar2').trigger('change').trigger('shown');
  
                                                       })&lt;/script&gt;")
                                )
                              )
                     )
                     )
  )
  </code></pre>
  
  <p>When you click in the sidebar panel of foo1 the link to foo2 responds. But when you do the same in Bar, it goes somewhere else.</p>