on Jquery template how do i set css class dynamically?

Question

I'm using asp.net web api project and using jquery template in that.

in ready
$('a').click(function () {
            debugger;
            // remove the selected class from all anchors
            $('.row a').removeClass('selected');

            // Add the selected class to the currently clicked anchor
             $(this).addClass('selected');            
        });

<div class="row">
            <div class="span3">
                <!-- Added dynamic data from script GroupTypeTemplate -->              
            </div>
</div>
<script id="GroupTypeTemplate" type="text/html">
                <nav id="options" class="work-nav">
                    <ul id="filters" class="option-set" data-option-key="filter">                                            
                         <li>                            
 <a onclick="getGroupById('${Id}')"  data-option-value="*">${TypeName}</a>
                         </li>
                    </ul>
                </nav>                 
                </script>

I want to set that class attribute dynamically as per which menu is currently active

But how to check which id is currently active accordingly I can set class="selected"

What is the syntax in jquery template ?

sorry to ask you but i'm new to jquery template where and what is the syntax to do so? — Neo
– Neo, Commented Jan 21, 2014 at 19:03

Hugo S. Mendes · Accepted Answer · 2014-01-21 19:05:49Z

1

this will put the selected attr only to the a that was clicked.

$("a").click(function(){
    $("a").removeClass("selected");
    $(this).addClass("selected");
});

answered Jan 21, 2014 at 19:05

Hugo S. Mendes

1,18611 silver badges23 bronze badges

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

2 Comments

Hugo S. Mendes Over a year ago

Is your <li><a></a><li> generated dinamically? try to put this inside $(document).ready(function(){ PUTHERE });

Hugo S. Mendes Over a year ago

then try to use $("a").on('click', function(){ $("a").removeClass("selected"); $(this).addClass("selected"); }); instead.

Matt Bodily · Accepted Answer · 2014-01-21 19:47:22Z

0

to get script to work on dynamically added content you need to put the event on the document like this

$(document).on('click', 'a', function(){
    //remove, add here
});

answered Jan 21, 2014 at 19:47

Matt Bodily

6,4134 gold badges32 silver badges51 bronze badges

Collectives™ on Stack Overflow

on Jquery template how do i set css class dynamically?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related