CODEWITHSUNDEEP
jqueryselector
mrN
mrN

Reputation: 3770

jquery Selector problem

How to select all the child elements within a certain <div> except the active one? For example:

<div>
    <a id="1" class="item" href="#">Item 1 </a>
    <a id="2" class="item" href="#">Item 2 </a>
    <a id="3" class="item" href="#">Item 3 </a>
</div>

<script>
$(function() {
    $(".item").mouseover(function() {


        // HOW TO hide all the items with class item except this one


    });
});

Upvotes: 0

Views: 73

Answers (4)

Shoe
Shoe

Reputation: 76300

You can use the $(this) selector to except the item on mouse over.

Upvotes: 0

dotariel
dotariel

Reputation: 1604

Think of it differently... Hide all, then show me:

$(function() {
    $(".item").mouseover(function() {

        // Hide all:
        $('.item').hide();

        // Show "me":
        $(this).show();


    });
});

Upvotes: 0

Nick Craver
Nick Craver

Reputation: 630607

You can use .not() to exclude this (the current element), like this:

$(function() {
    $(".item").mouseover(function() {
       $(".item").not(this).hide();
    });
});

Or, if they're always siblings use .siblings(), like this:

$(function() {
    $(".item").mouseover(function() {
       $(".item").siblings().hide();
    });
});

Upvotes: 1

sod
sod

Reputation: 3928

$('.item').not($(this).show()).hide();

Upvotes: 1

Related Questions