Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 490
  • Last Modified:

jQuery :eq() selector not working

Hello,

I have 4 unordered lists set to display:none, each have the same class name, and I want to show ONLY the first one.

The code I have made just shows all of the elements, and not just the first one.

I have included the code in the code section.

Thanks for any assistance,

Luke
$('.result_list:eq(0)').delay(600).fadeTo("fast", 0.5);

<ul class="result_list"> 
<li><a href="page.php?subject_id=2">Corks</a></li> 
<li><a href="page.php?subject_id=3">Wines</a></li> 
<li><a href="page.php?subject_id=4">Facebook</a></li> 
<li><a href="page.php?subject_id=5">Cinemas</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=6">Cinema</a></li> 
<li><a href="page.php?subject_id=7">Internet</a></li> 
<li><a href="page.php?subject_id=9">Microsoft</a></li> 
<li><a href="page.php?subject_id=11">Houses</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=12">School</a></li> 
<li><a href="page.php?subject_id=13">High School</a></li> 
<li><a href="page.php?subject_id=19">Cups</a></li> 
<li><a href="page.php?subject_id=22">Magic</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=24">China</a></li> 
<li><a href="page.php?subject_id=27">Computers</a></li> 
</ul>

Open in new window

0
stellaartois
Asked:
stellaartois
1 Solution
 
David S.Commented:
The code you posted works fine for me with jQuery 1.5.2. The first is faded to 50% opacity and the others are fully visible (or fully hidden when I make a rule for that class with "display:none").
0
 
darren-w-Commented:
Were you using the document ready?  ie: $(function(){        });

i too have correct result

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>demo</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function(){$('.result_list:eq(0)').delay(600).fadeTo("fast", 0.5);
            });
        </script>
    </head>
    <body>
        <ul class="result_list">
            <li><a href="page.php?subject_id=2">Corks</a></li>
            <li><a href="page.php?subject_id=3">Wines</a></li>
            <li><a href="page.php?subject_id=4">Facebook</a></li>
            <li><a href="page.php?subject_id=5">Cinemas</a></li>
        </ul>
        <ul class="result_list">
            <li><a href="page.php?subject_id=6">Cinema</a></li>
            <li><a href="page.php?subject_id=7">Internet</a></li>
            <li><a href="page.php?subject_id=9">Microsoft</a></li>
            <li><a href="page.php?subject_id=11">Houses</a></li>
        </ul>
        <ul class="result_list">
            <li><a href="page.php?subject_id=12">School</a></li>
            <li><a href="page.php?subject_id=13">High School</a></li>
            <li><a href="page.php?subject_id=19">Cups</a></li>
            <li><a href="page.php?subject_id=22">Magic</a></li>
        </ul>
        <ul class="result_list">
            <li><a href="page.php?subject_id=24">China</a></li>
            <li><a href="page.php?subject_id=27">Computers</a></li>
        </ul>
    </body>
</html>

Open in new window

0
 
Lukasz ChmielewskiCommented:
It does work. I guess what darren-w pasted would do (or use the $(document).ready();

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-git.js"></script>
</head>
<body>

<ul class="result_list"> 
<li><a href="page.php?subject_id=2">Corks</a></li> 
<li><a href="page.php?subject_id=3">Wines</a></li> 
<li><a href="page.php?subject_id=4">Facebook</a></li> 
<li><a href="page.php?subject_id=5">Cinemas</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=6">Cinema</a></li> 
<li><a href="page.php?subject_id=7">Internet</a></li> 
<li><a href="page.php?subject_id=9">Microsoft</a></li> 
<li><a href="page.php?subject_id=11">Houses</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=12">School</a></li> 
<li><a href="page.php?subject_id=13">High School</a></li> 
<li><a href="page.php?subject_id=19">Cups</a></li> 
<li><a href="page.php?subject_id=22">Magic</a></li> 
</ul> 
<ul class="result_list"> 
<li><a href="page.php?subject_id=24">China</a></li> 
<li><a href="page.php?subject_id=27">Computers</a></li> 
</ul>

<script>
    $('.result_list:eq(0)').delay(600).fadeTo("fast", 0.1);
</script>

</body>
</html>

Open in new window



0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now