jquery each() function's proper usage

Question

I am trying to use jquery each() function but i think there is something wrong.
Here is the html and jquery code.

<div class="tribute">
<div class="image"></div>
<div class="links"></div>
</div>

<div class="tribute odd">
<div class="image"></div>
<div class="links"></div>
</div>

<div class="tribute">
<div class="image"></div>
<div class="links"></div>
</div>

<div class="tribute odd">
<div class="image"></div>
<div class="links"></div>
</div>

<div class="tribute">
<div class="image"></div>
<div class="links"></div>
</div>

<div class="tribute odd">
<div class="image"></div>
<div class="links"></div>
</div>

and jquery function

   jQuery('.odd').each(function(index, value){

     var oddLinks = jQuery('.odd').find('.links').detach();
     jQuery('.odd .image').before(oddLinks);

    });

this code is not properly working for me.

i want detach() .links div and append before .image only for odd wrapper. — Muhammad Furqan
– Muhammad Furqan, Commented Oct 20, 2012 at 10:58
The .each() method runs a loop through the matched elements, in this case it is all the <div>s with .odd. I don't see you using index or value, value refers to the singular matched element. Why are you doing $('.odd') again inside the .each() loop? — VKen
– VKen, Commented Oct 22, 2012 at 0:52

Esailija · Accepted Answer · 2012-10-20 10:40:13Z

3

Try using the context of the current .odd when iterating:

jQuery('.odd').each(function(index, value) {
    var oddLinks = jQuery(this).find('.links').detach();
    jQuery('.image', this).before(oddLinks);
});

.odd selects all .odd elements on the page.

answered Oct 20, 2012 at 10:40

Esailija

140k24 gold badges280 silver badges328 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

xdazz · Accepted Answer · 2012-10-20 11:05:01Z

1

Did you mean change the position of image and link in .odd div? If so, you even don't need to detach it.

See the live demo.

$('.odd').each(function() {
  $(this).find('.image').before($(this).find('.links'));
});

edited Oct 20, 2012 at 11:05

answered Oct 20, 2012 at 10:40

xdazz

161k38 gold badges255 silver badges278 bronze badges

3 Comments

Muhammad Furqan Over a year ago

yes! i want detach() .links div and append before .image only for odd wrapper.

Muhammad Furqan Over a year ago

before() function is also detach elements ?

xdazz Over a year ago

@Furqan The element is still in the dom tree, so it's not necessary to detach it from the dom tree.

Collectives™ on Stack Overflow

jquery each() function's proper usage

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related