title: RShiny: retrieving jsQuery selectors for UI items in tabsetPanel that have randomly generated IDs
body: <p>I'm trying to create a form in an rShiny dashboard that will allow the user to add rows with insertUI. In order for the insertUI function to work properly, it needs the jQuery selector of the last row of the form. This lets the insertUI know where to place the new row.</p>
  
  <p>The problem I'm running into: because this form is wrapped in a tabPanel, the jQuery selector required to reference each row appears to be randomized. Every time the app loads, the ID used to reference the tab-pane appears as "tab-XXXX-1", with four random digits in place of the XXXX. I used "Inspect Element" in Chrome to see this for myself. </p>
  
  <p>Is there any way to force the tab panel to just stick with one ID that I give it? Code to recreate this is below. Any and all help is much appreciated!</p>
  
  <pre><code># Libraries---
  library(shiny)
  library(shinydashboard)
  library(tidyverse)
  library(shinyWidgets)
  library(shinyjs)
  library(Cairo)
  library(plotly)
  library(purrr)
  library(zoo)
  library(DT)
  library(magrittr)
  
  #ui------
  
  ui_body_BDay &lt;- tabPanel("Birthday inputs",
                      value ="BDay_inputs",
                      fluidRow(
                        column(3, textInput(inputId = paste0("name", 1), 
                                            label = paste0("Name ", 1))),
                        column(3, dateInput(inputId = paste0("b-day", 1) , 
                                            label = paste0("Birthday", 1)))
                      ),
                      fluidRow(
                        column(3, textInput(inputId = paste0("name", 2), 
                                            label = paste0("Name ", 2))),
                        column(3, dateInput(inputId = paste0("b-day", 2) , 
                                            label = paste0("Birthday", 2)))
                      ),
                      #button to add rows
                      fluidRow(
                        column(9, actionButton("add", "Add row"))
                      )
  )
  
  ui_dashboardBody &lt;- dashboardBody(
    tabItems(
      tabItem(
        tabName = "tab_BDay",
        tabBox(title = "", width = 12,
               id = "BDay_tabset",
               ui_body_BDay)
      )
    )
  )
  
  ui_sidebar_item &lt;- dashboardSidebar(
    menuItem(
      text = "Birthday Collection",
      tabName = "tab_BDay",
      icon = icon("wrench", lib = "font-awesome")
    )
  )
  
  ui &lt;- dashboardPage(
    header = dashboardHeader(title = "Birthday example"),
    sidebar = ui_sidebar_item,
    body = ui_dashboardBody
  )
  
  #server-----
  
  server &lt;- function(input, output, session){
    DefRows &lt;- 2 #initialize with default number of rows, 2
    values &lt;- reactiveValues(NumRows = DefRows)
  
    #Code for adding rows when button is clicked ---
    observeEvent(input$add, {
      values$NumRows &lt;- values$NumRows + 1
      insertUI(
        #This is the problematic line: the id for the tabPanel object, tab-XXXX-1, changes every time the app loads
        selector = paste0("#tab-9719-1 &gt; div:nth-child(", values$NumRows-1, ") &gt; div:nth-child(1)"),
        where = c("afterEnd"),
        fluidRow(
          column(3, textInput(inputId = paste0("name", values$NumRows), 
                              label = paste0("Name ", values$NumRows))),
          column(3, dateInput(inputId = paste0("b-day", values$NumRows) , 
                              label = paste0("Birthday ", values$NumRows)))
        )
      )
    })
  }
  shinyApp(ui, server)
  </code></pre>