jQuery - Toggle an attribute

Question

I have the following code

value.bind( function( to ) {
    $( '#header.alt.reveal' ).attr('style', 'background:transparent;', to );

It's placed in a function that adds the attribute when a checkbox is checked. However, I want to make this toggle so that when it is unchecked the attribute is removed. Can someone explain how I do this please

For a bit of context - this is the js file that controls real time changes in the wordpress customizer - the whole of this snippet looks like this:

// FRONT PAGE MENU TRANSPARENCY
wp.customize( 'front_page_menu_transaprency', function( value ) {
    value.bind( function( to ) {
        $( '#header.alt.reveal' ).toggle.attr('style', 'background:transparent;', to );

    });
});

Answer 1

I believe you're looking for something like this. I'm just changing the background color to red when something is true.

$('#header.alt.reveal').css('background-color', function () {
  return to ? '#f00' : 'transparent';
});

Answer 2

I believe you're looking for something as follows:

$(".checkbox").click(function(){
   if($(this).is(':checked')){
       $('#header.alt.reveal').addClass('classname');
   }else{
       $('#header.alt.reveal').removeClass('classname');
   }
});