How to change css property using jquery with this code

Question

"#business" is currently set to background: #323232; How can I change it to #000; after I click on "#business" and back to 323232 once the menu is closed?

$(document).ready(function() {

    $("#business").click(function(){
        jQuery.fx.off = true;
        $("#businessmenu").toggle("");
    });

    $('html').click(function() {
        $("#businessmenu").hide("");
    });

    $('#business').click(function(event){
        event.stopPropagation();
    });

});

Here is the html:

<a href="#" id="business">Biz name</a>
<div id="businessmenu">
    <a href="help.html">Help</a>
</div>

Answer 1

You can use the css method to change a CSS property (or multiple properties if necessary):

$("#business").click(function(event){
    jQuery.fx.off = true;
    $("#businessmenu").toggle("");
    $(this).css("background-color", "#000");
    event.stopPropagation();
});
$('html').click(function() {
    $("#businessmenu").hide();
    $("#business").css("background-color", "#323232");
});

Note that I've combined the 2 event listeners you had bound to #business as it's makes no difference to just bind the one.

As a side note, is there a reason you are passing an empty string to hide? That shouldn't be necessary.

Answer 2

If you want to change the background of an element (in your case "#business") to a color, you simply do:

$("#business").css({
     "background": "#000"
});

But I am not sure what you mean by the "menu", you should probably show us the code of your HTML!