Bill EE
Bill EE

Reputation: 31

Css selector : how to select elements with certain class name

I have an idea to add a dynamic css style by changing my label and make my input elements show differently when item.areaNo changes. I successfully gave my label element class='1', but css class did not understand my selector.I really need to know how to set the correct one.

<ol class="cabin fuselage">
    <li class="row row--1">
        <ol class="seats" type="A">
            <li class="seat"><input type="checkbox" id="01-01" />
                <label for="01-01">01-01</label></li>
            <li class="seat"><input type="checkbox" id="02-01" /> <label
                for="02-01">02-01</label></li>

this is my jsp,

.seat label.1{background: #50bdc9;}

and my css,

both reference to https://codepen.io/siiron/pen/MYXZWg BY Ronny Siikaluoma

$.getJSON("gametransfer.controller", function(json) {
         $.each(Object.values(json), function(i, item) {
            console.log(item)
            var aa = '#' + item.seatNo;
            if ($('.seat>input').is(aa)) { 
                if (item.attr == true) {
                    $(aa).prop('disabled', true);                                               
                }
                $(aa).siblings('label').addClass('1');  
            }/*end of outer if */                           
        });
    });

solved :all of those attempts failed and return with all of the item.areaNo in first label elements.

Upvotes: 0

Views: 150

Answers (1)

Neeraj Pathak
Neeraj Pathak

Reputation: 759

You need find no. of a child (li.seat) then you can use for loop then find label one by one and put different CSS for each label. I hope it's work.

Upvotes: 1

Related Questions