Mateo
Mateo

Reputation: 177

How to add class to a certain element with a custom attribute?

I have a list with some LI links.

I want to add a class to this li when the link is clicked, here you are my code:

<ul id="sliders_buttons_list">
            <a href="#" uid="1">
                <li class="" uid="1">
                    First tab
                </li>
            </a>

            <a href="#" uid="2">
                <li class="" uid="2">
                    Second tab
                </li>
            </a>

            <a href="#" uid="3">
                <li class="" uid="3">
                    Third tab
                </li>
            </a>

        </ul>

If I click the link with uid = 1 I wand to add a new class to the li with uid = 1

Thanks!

Upvotes: 1

Views: 1525

Answers (3)

Naftali
Naftali

Reputation: 146302

Try this:

$('#sliders_buttons_list a').click(function(){

     $('li[uid='+$(this).attr('uid')+']').addClass('newClass');

})

So if you click on a with uid=1, the li with uid=1 will get the class 'newClass'
Same for uid=2 and so on..

Upvotes: 1

Mark Coleman
Mark Coleman

Reputation: 40863

$("#sliders_buttons_list a[uid]").click(function(){
    var uid = $(this).attr("uid");
  $(this).find("li[uid='" + uid +"']").addClass("someClass");
});

Code example on jsfiddle

Upvotes: 0

scrappedcola
scrappedcola

Reputation: 10572

$("#sliders_buttons_list").delegate("a", "click", function()
{
     var uid = this.getAttribute("uid");
     $(this).find("li").addClass("uid_" + uid);
});

Upvotes: 1

Related Questions