javascript to change css class, rather than append to it

Question

How do I change the below javascript to change my css class, rather than add/append to it?

<script type="text/javascript">
    (function($){   
        $(document).ready(function(){
        $('ul#horizontal.nav.menu').addClass('myNewClass');
        });
    })(jQuery);
</script>

EDIT

I am trying to change the following UL:

<ul class="nav menu" id="horizontal">

to

<ul class="myclass" id="horizontal">

I have tried the following just before my closing </body> tag and not working:

<script type="text/javascript">
        (function($){   
          $(document).ready(function(){
            // add items for bootstrap dropdown's
              $("#horizontal").attr("class", "myclass");
            })(jQuery);
        </script>

Right in the documentation for removeClass: api.jquery.com/removeClass — David Fleeman
– David Fleeman, Commented Nov 1, 2013 at 13:22
@DhavalMarthak that is what he has now, in a closure to ensure the $ variable within the function will not conflict with any other library — Rory McCrossan
– Rory McCrossan, Commented Nov 1, 2013 at 13:22
id's are meant to be unique.. no need of making it more narrow by giving classnames like .nav or .menu. or prefixing with ul.. I may be wrong but I don't recommend it. Then you should do like this document.getElementById('horizontal').className = "myNewClass"; — Mr_Green
– Mr_Green, Commented Nov 1, 2013 at 13:24
I have tried all of these & added script just before my closing </body> tag & they don't work. I am trying to change <ul class="nav menu" id="horizontal"> to <ul class="myclass" id="horizontal"> — user991830
– user991830, Commented Nov 1, 2013 at 13:36

antyrat · Accepted Answer · 2013-11-01 13:21:29Z

2

You can try to use attr method:

$('ul#horizontal.nav.menu').attr( 'class', 'myNewClass');

answered Nov 1, 2013 at 13:21

antyrat

27.7k9 gold badges78 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Robert de Jonge · Accepted Answer · 2013-11-01 13:21:31Z

1

Quite easy..

$("#mydiv").attr("class", "myclass");

answered Nov 1, 2013 at 13:21

Robert de Jonge

1193 silver badges12 bronze badges

Comments

Alex Coroza · Accepted Answer · 2013-11-01 13:26:41Z

0

$("#mydiv").prop("class", "myclass");

answered Nov 1, 2013 at 13:26

Alex Coroza

1,7573 gold badges23 silver badges39 bronze badges

1 Comment

antyrat Over a year ago

You should use className instead if you use prop method and not attr.

Collectives™ on Stack Overflow

javascript to change css class, rather than append to it

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related