henk
henk

Reputation: 2838

How to select multiple html-elements by class and change their different values?

I am searching for the right syntax for the following problem:

I got some elements on the page with the same class="power", I want select them all and raise their value by 3. How do i achieve this in jquery?

my solution so far, sets the value of all elements to 4.

<div class="power">1</div>
<div class="power">2</div>
<div class="power">3</div>
<div class="power">4</div>



 <script>
    $('.power').html(foo($('.power').html()));
    function foo(bla){
        var output = parseInt(bla)+3;
        return output;
    }


</script>

output

4
4
4
4

what i want

4
5
6
7

I guess

Upvotes: 1

Views: 43

Answers (2)

area28
area28

Reputation: 1425

You can use .each().

$('.power').each(function(){
    var output = parseInt($(this).text())+3;
    $(this).html(output);
});

Upvotes: 4

marekful
marekful

Reputation: 15351

Use jQuery.each.

$('.power').each(function() {
  $(this).html(foo($(this).html()));
});

Upvotes: 2

Related Questions