CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user1359023
user1359023

Reputation: 33

Jquery, change border if div is present but only from that item in a list

I have a list of items like this:

<div class="wine"> <H1>Title</H1> <div class="promotion"></div></div>
<div class="wine"> <H1>Title</H1> </div></div>
<div class="wine"> <H1>Title</H1> </div></div>
<div class="wine"> <H1>Title</H1> <div class="promotion"></div></div>

When the div .promotion exists in the wine dive i want to give the wine class a red border. But only for that element of course not for all the wine classes..

Anyone have an idea?

Upvotes: 0

Views: 58

Answers (4)

Felix
Felix

Reputation: 38112

Please note that you need to remove redundant closing </div> tag after second and third <div class="wine"> to make your HTML markup correct.

After that, you can use .closest():

$('.promotion').closest('.wine').css('border','1px solid red');

Fiddle Demo

Upvotes: 1

j08691
j08691

Reputation: 207943

$('.wine:has(div.promotion)').css('border','1px solid red')

jsFiddle example

Upvotes: 0

Adil
Adil

Reputation: 148150

You can use .has() method on .wine to check if it has .promotion

Live Demo

$('.wine').has('.promotion').css('border', 'red 1px solid');

Upvotes: 0

Dryden Long
Dryden Long

Reputation: 10180

You can use the .parent() selector to do this like so:

$('.promotion').parent('.wine').css('border', 'red 1px solid');

Here is a fiddle showing it off: http://jsfiddle.net/33Ugf/

Upvotes: 2

Related Questions