jQuery changing style of HTML element

Question

I have a list on HTML   lt div id  header  class  row  gt       lt div id  logo  class  col 12  gt And the winner is lt span gt n t    lt  span gt  lt  div gt        lt div id  navigation  class  row  gt            lt ul id  pirra  gt               lt li gt  lt a href     gt Why  lt  a gt  lt  li gt               lt li gt  lt a href     gt Synopsis lt  a gt  lt  li gt               lt li gt  lt a href     gt Stills Photos lt  a gt  lt  li gt               lt li gt  lt a href     gt Videos clips lt  a gt  lt  li gt               lt li gt  lt a href     gt Quotes lt  a gt  lt  li gt               lt li gt  lt a href     gt Quiz lt  a gt  lt  li gt           lt  ul gt       lt  div gt      it changes fine to show horizontally on CSS change      div navigation ul li            display  inline-block          but now I want to do it with jQuery  I use         document  ready function       console log  hello           navigation ul li   css  display    inline-block          but is not working  What do i have wrong to style my element with jQuery   thanks

User · Answer

navigation ul li   css   display     inline-block       It seems a typo there    syntax mistake

User · Answer

you could also specify multiple style values like this       navigation ul li   css   display    inline-block   background-color     ff0000    color     ffffff

User · Answer

I think you can use this code also  and you can manage your class css better    lt style gt      navigationClass          display  inline-block          padding  0px 0px 0px 6px          background-color  whitesmoke          border-radius  2px         lt  style gt   lt div id  header  class  row  gt       lt div id  logo  class  col 12  gt And the winner is lt span gt n t    lt  span gt  lt  div gt        lt div id  navigation  class  row  gt            lt ul id  pirra  gt               lt li gt  lt a href     gt Why  lt  a gt  lt  li gt               lt li gt  lt a href     gt Synopsis lt  a gt  lt  li gt               lt li gt  lt a href     gt Stills Photos lt  a gt  lt  li gt               lt li gt  lt a href     gt Videos clips lt  a gt  lt  li gt               lt li gt  lt a href     gt Quotes lt  a gt  lt  li gt               lt li gt  lt a href     gt Quiz lt  a gt  lt  li gt           lt  ul gt       lt  div gt    lt script gt        document  ready function         navigation ul li   addClass  navigationClass      add class navigationClass to the  navigation          lt  script gt

User · Answer

navigation ul li   css  display    inline-block      not a colon  a comma

User · Answer

Use this       navigation ul li   css  display    inline-block      Also  as others have stated  if you want to make multiple css changes at once  that s when you would add the curly braces  for object notation   and it would look something like this  if you wanted to change  say   background-color  and  position  in addition to  display         navigation ul li   css   display    inline-block    background-color     fff    position    relative       The specific CSS changes after the first one  are  of course  just examples

User · Answer

changing style with jquery  Try This      selector id   css  display   none      You can also change multiple attribute in a single query  Try This      replace-div   css   padding-top    5px     margin     10px

[jquery] jQuery changing style of HTML element

Examples related to jquery

Examples related to html

Examples related to css