Select div's ids that has specific class

I have something very similar to this

<div id="bigBadDiv">
<开发者_StackOverflow中文版div class="head">
    blabla
</div>

<div class="contents">
    <div class="1">
        <div id="432" class="item "></div>
        <div id="45" class="item selected"></div>
        <div id="86" class="item "></div>
        <div id="3" class="item "></div>
    </div>

    <div class="2">
        <div id="443" class="item"></div>
        <div id="867" class="item selected"></div>
        <div id="43" class="item selected"></div>
        <div id="98" class="item selected"></div>
    </div>


    <div class="3">
        <div id="423" class="item selected"></div>
        <div id="167" class="item "></div>
        <div id="4453" class="item "></div>
        <div id="944" class="item "></div>
    </div>
</div>

<div class="footer">
    blabla
</div>

I want to select id's only of .selected items and I try to make it with

 $('#bigBadDiv :has(.selected)').css({'backgroundColor':'red'});

but it turns the .contents background to red...

Do you know why is that happening ?

Can you help me select every div.selected and take its id valu? Maybe with some kind of loop .. ?

For the selector, just leave :has() wrapper. For the ID part, you can get an array of ids using .map(), like this:

var ids = $('#bigBadDiv .selected').map(function() { return this.id; }).get();

You can test it out here.

$('#bigBadDiv .selected').css({'backgroundColor':'red'});

if you use the standards conform

selected="selected"

you can query the result by

$('*.div').attr('selected')? Do something if : do something if not;