just_user
just_user

Reputation: 12067

Javascript change style where style equals something

I'm trying to add some style properties on an image but only if it already contains another property. I have more or less figure out how to do this with the following:

if ($('#content p img').css('float') == 'right')
    $('#content p img').css('margin-left', '20px').css('margin-bottom', '20px');

But this obviously changes all images so they have margin left and bottom. How can I do the same but only add the margin to the images that has the float: right; property?

Upvotes: 1

Views: 811

Answers (2)

Akhil Sekharan
Akhil Sekharan

Reputation: 12693

Try:

$('#content p img').each(function(){
    if($(this).css('float') == 'right') 
        $(this).css('margin-left', '20px').css('margin-bottom', '20px');
})

Upvotes: 4

T.J. Crowder
T.J. Crowder

Reputation: 1075427

Use filter:

$('#content p img').filter(function() {
    return this.style.float === "right";
}).css('margin-left', '20px').css('margin-bottom', '20px');

And you can call css just once if you like, passing in a set of changes to make:

$('#content p img').filter(function() {
    return this.style.float === "right";
}).css({
    'margin-left':   '20px',
    'margin-bottom': '20px'
});

Upvotes: 5

Related Questions