Change CSS of selected item in sharepoint menu

Question

Is there a way to do the same as done here with some Javascript?

AspMenu does not render css-class for 'selected' element

I want to use this CSS for the selected item in the menu

.s4-tn > .menu-horizontal ul li a.selected {
color: #ffffff!important;
background-color:#4682B4; /*Fallback*/
background: -webkit-gradient(linear, left top, left bottom, from(#4682B4), to(#4682B4));
background: -moz-linear-gradient(top, #4682B4, #4682B4);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4682B4, endColorstr=#4682B4);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4682B4, endColorstr=#4682B4)";
line-height:30px;
height:31px;
border:0px;
padding:0px;
margin:0px;
}

Answer 1

You could use jquery to select the tag that you want by the class/id/type of that and change the CSS by the css jquery property.

For example:

$("div").click(function () {
  var html = ["The clicked div has the following styles:"];
  var styleProps = $(this).css( ["width", "height", "color", "background-color"] );
  $.each( styleProps, function( prop, value ) {
    html.push( prop + ": " + value );
  });
  $( "#result" ).html( html.join( "<br>" ) );
});

More information: http://api.jquery.com/css/