Conditional text styling in Shiny and number formatting

[Jitu]

Hi, Everyone

I am trying to build a shiny app where if the textOutput value is changed above 20 then the color of the textOutput changes to red else it stays blue. I am not able to get hold of the javascript to do this kind of styling. Also, it would be grateful if someone could tell me that is it possible to change the number format in numericInput like for e.g 10,000, 2.4% etc. so that the numbers are displayed in this particular format. I have seen other Shiny examples where the format have been changed for the Text input but I don't need that.

Below is the simple code I was trying to write Java in shiny.

library(shiny)
    ui <- fluidPage(

                # Can you change numeric format by using javascript? 
                numericInput('num', "Length", value=19),

                textOutput("text"),

            tags$script(HTML("

                     /*Tried getting the textoutput value in javascript!!*/
                     var trigger = document.getElementById('text').innerHTML;

                     /* Tried writing that when value of text change above 20
                     Then the color of the text also changes
                     based on a threshold value condition*/
                     trigger.addEventListener('change', function(){
                                  var target = document.getElementById('text');
                                  var color = parseInt(trigger) > 20 ? 'red' : 'blue';
                                  target.style.color = color;
                          });
                     ")) # Simply not working!!

              )

         server <- function(input, output, session) {
                        output$text <- renderText({
                                            input$num
                             })
            }
       shinyApp(ui = ui, server=server)  

Thanks in advance.