Theodoros80
Theodoros80

Reputation: 796

Toggle class of an element with given id

I have the following code:

<dl>
  <dt id="1"><a href="#">One</a></dt>
  <dd class="hidden" id="1">Test one</dd>
</dl>

<dl>
  <dt id="2"><a href="#">Two</a></dt>
  <dd class="hidden" id="2">test Two</dd>
</dl>

<dl>
  <dt id="3"><a href="#">Three</a></dt>
  <dd class="hidden" id="3">test three</dd>
</dl>

When some1 clicks on a <dt> element i want to change the class of <dd> with the same id to "show"

Here is my script:

$(document).on('click', 'dt', function () {
    var fq=$(this).attr("id");
    $("dd").removeClass("hidden").addClass("show");
    console.log($(this).attr("id"));
});

With the above code, i can get the id of the clicked <dt>, but how do i change the class of the <dd> with the same id?

Upvotes: 0

Views: 174

Answers (1)

manassorn
manassorn

Reputation: 450

Use:

$(document).on('click', 'dt', function () {
    $(this).next('dd').removeClass("hidden").addClass("show");
});

Upvotes: 2

Related Questions