Solved

jquery each

Posted on 2011-09-18
5
157 Views
Last Modified: 2012-05-12
http://api.jquery.com/each/

please take a look at example2, what's the difference between these two methods?
<script>
     $("span").click(function () {
      $("li").each(function(){
        $(this).toggleClass("example");
      });
    });
 
	 $("span").click(function () {
      
        $('li').toggleClass("example");
      
    });
	
	
</script>

Open in new window

0
Comment
Question by:charmingduck
5 Comments
 
LVL 13

Accepted Solution

by:
dsmile earned 84 total points
ID: 36558134
.each( function(index, Element) ) Returns: jQuery

Description: Iterate over a jQuery object, executing a function for each matched element.


This code
$("span").click(function () {
      $("li").each(function(){
        $(this).toggleClass("example");
      });
    });

Open in new window


Will do toggleClass to each of "li" found in "span" by looping throuhg the "li" list.
This means you can do something else with each of these "li" individually.

While this code
$("span").click(function () {
      
        $('li').toggleClass("example");
      
    });

Open in new window

will do toggleClass for ALL the "li" found
0
 

Author Comment

by:charmingduck
ID: 36558147
sorry, by

$("span").click(function () {
     
        $('li').toggleClass("example");
     
    });

I actually meant
$("span").click(function () {
     
        $('span li').toggleClass("example");
     
    });



and when you say something else with each of these "li" individually, do you mean like this? am I understanding this correctly? is this the major advantage or difference? or maybe can you show me an example that in some cases it'd be better to choose each over simply using the all ** ?

$("span").click(function () {
      $("li").each(function(){
        $(this).toggleClass("example");
       $(this).somethingelse();
      });
    });
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 36558158
There is no difference as far as functionality is concerned. Both will toggle class 'Example' of li, in case any span is clicked
0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 41 total points
ID: 36558165
You can't do something like that :
      $("li").each(function(){
          $(this).toggleClass("example");
          $(this).somethingelse();
          alert("ok");
          function1();
          function2();
      });
without a loop (using $.each or $.map... while, for, do...)
0
 
LVL 13

Assisted Solution

by:dsmile
dsmile earned 84 total points
ID: 36558169
@charmingduck:

first of all, your new code doesn't work

$("span").click(function () {
     
        $('span li').toggleClass("example");
     
    });


second, yes, that's what I mean, but specifically, it allows you to do this (do distinguish with ALL)

$("span").click(function () {
     
       $('li').each(function(index) {
    if (index % 2 == 0)
    {
      alert('you cant do this with second case'); // this message shows each 2 item
    }
  });
     
    });


0

Featured Post

Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

Join & Write a Comment

Never store passwords in plain text or just their hash: it seems a no-brainier, but there are still plenty of people doing that. I present the why and how on this subject, offering my own real life solution that you can implement right away, bringin…
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.
This tutorial demonstrates a quick way of adding group price to multiple Magento products.

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now