CODEWITHSUNDEEP
javascriptjquery
code-gijoe
code-gijoe

Reputation: 7234

How to get multiple elements with same class?

I have some HTML I want to process with jquery.

Pretty simple but I cannot get around getting all the elements with the same class:

<div class="myclass on"></div>
<div class="myclass off"></div>
<div class="myclass on"></div>

If I do this

$(".myclass")

I get only one. Any help?

EDIT

I actually only want the 'myclass on' to nest some html in each one to get this:

<div class="myclass on"><img src="bar.png"></div>
<div class="myclass off"></div>
<div class="myclass on"><img src="bar.png"></div>

Upvotes: 0

Views: 653

Answers (4)

Sanjay
Sanjay

Reputation: 1745

May be u did some wrong. If you have done $('.myclass') it must work. Can you post your codes.

This works for me like a charm.

$(function(){
    $('.myclass').SOMEEVENT(function(e){ // or use div.myclass without problem 
        // do something. It must work.
    });
});

OR if you want to iterate through each element, you can use .each

$(function(){
    $.each($('.myclass'),function(ind, val){
        // do something.
    });
});

OR if you want to use additional class like .on or .off

$(function(){
    $.each($('.myclass.on'),function(ind, val){
        // do something.
    });
});

EDIT:
To add image to myclass on, you can simply do this

$(function(){
    $('.myclass.on').html('Your NEW Adding Tag here');
});

Upvotes: 1

Sunil
Sunil

Reputation: 1248

$(".myclass.on").css('color', 'red');

Should select elements with both classes.

Upvotes: 0

bfavaretto
bfavaretto

Reputation: 71908

Maybe you are just not combining two classes correctly in the selector? Because this works:

$(".myclass.on").html('<img src="bar.png">');

http://jsfiddle.net/zjErL/1/ (Thanks Arun for the initial jsfiddle)

Upvotes: 2

theshadowmonkey
theshadowmonkey

Reputation: 679

Try using for manipulating each element separately. Just the class .on should be sufficient for the selector.

  $('.on').each(function(index){
    $(this).html('<img src="bar.png">');
  });

The documentation http://api.jquery.com/each/

Upvotes: 1

Related Questions