Javascript jQuery . Add class when the same data-date

Question

I have two tables

 <table>
     <tr>
       <td class="myclass" data-date="2015-07-09"> Some text </td>
     </tr>
 </table>

 <table>
    <tr>
       <td data-date="2015-07-09"> Text </td>
    </tr>
 </table>

What I want to do is:

Firstly take the class 'myclass' and add to it one new class 'newclass' . I can easily do it by $('.myclass').addClass('newclass');

Secondly I want to search the DOM if there is a < td > which has the same data-date with the .myclass < td > and add also to the newly found < td > the .newclass

Thank you in advance

Milind Anantwar · Accepted Answer · 2015-07-01 09:50:26Z

3

You can use:

 $('td[data-date='+$('.myclass').data('date')+']').addClass('newclass');

This will satisfy the both condition you are looking for. i.e. adding class to both the td elements.

$('.myclass').data('date') will get the date for myclass element. and attribute value selector to target all the td elments that have same data as that of myclass including myclass itself.

edited Jul 1, 2015 at 9:50

answered Jul 1, 2015 at 9:46

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

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

1 Comment

Yeldar Kurmangaliyev Over a year ago

Oh, yeah, it looks great :) There is no need to assign classes differently for two tables.

x3ns · Accepted Answer · 2015-07-01 10:04:22Z

1

You could simply do:

$('.myclass').each(function () {
    $('td[data-date="' + $(this).attr('data-date') + '"]').addClass('newclass');
}):

This will add the new class to each element with the same data-date, including the original one with myclass

Also, this would work fine even if you have multiple rows with a myclass - assuming your question was made more basic than your actual need.

edited Jul 1, 2015 at 10:04

answered Jul 1, 2015 at 9:58

x3ns

5202 silver badges10 bronze badges

Comments

ZelkiN · Accepted Answer · 2015-07-01 09:46:40Z

0

Try this

$("td[data-date='2015-07-09']").addClass('myClass');

answered Jul 1, 2015 at 9:46

ZelkiN

1,7811 gold badge10 silver badges6 bronze badges

Comments

Yeldar Kurmangaliyev · Accepted Answer · 2015-07-01 09:47:26Z

0

You can make it more simple if you give an id to your tables.
Like first-table-name and second-table-name.

In this case you will be able to do this with this code:

$("#first-table-name .myclass").each(function() {
    $(this).addClass("newClass");
    $("#second-table-name td[data-date='" + $(this).data('date') + "']").addClass("newClass");
});

answered Jul 1, 2015 at 9:47

Yeldar Kurmangaliyev

34.3k13 gold badges64 silver badges104 bronze badges

Collectives™ on Stack Overflow

Javascript jQuery . Add class when the same data-date

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related