CODEWITHSUNDEEP
jqueryhtmlcss
Sachin Jain
Sachin Jain

Reputation: 21842

How to change css of element using jquery

I have defined a CSS property as

#myEltId span{
  border:1px solid black;
}

On clicking a button, I want to remove its border.

$('#button1').click(function() {
  // How to fetch all those spans and remove their border
});

Upvotes: 10

Views: 46299

Answers (2)

felixyadomi
felixyadomi

Reputation: 3396

If you will use this several times, you can also define css class without border:

.no-border {border:none !important;}

and then apply it using jQuery;

$('#button1').click(function(){
        $('#myEltId span').addClass('no-border');
});

Upvotes: 5

David Thomas
David Thomas

Reputation: 253308

Just use:

$('#button1').click(
    function(){
        $('#myEltId span').css('border','0 none transparent');
    });

Or, if you prefer the long-form:

$('#button1').click(
    function(){
        $('#myEltId span').css({
            'border-width' : '0',
            'border-style' : 'none',
            'border-color' : 'transparent'
        });
    });

And, I'd strongly suggest reading the API for css() (see the references, below).

References:

Upvotes: 29

Related Questions