Dynamically created selectors in jQuery

Question

Hi I am trying to dynamically create a selector for jQuery instead of using a static one. The problem is, it is not working predictably/consistently.

I created a fiddle here: http://jsfiddle.net/Cc92f/

If you click run and click in each of the top radio buttons once, they work, but you cannot use the same buttons a second time.

If you click a top button, and then a bottom button, you can no longer click any of the buttons.

You may have to reload it a couple of times to see how different uses break it in different ways.

Thanks you for any and all help!

    $(".concattest").click(function(event)
    {
        var radioid=event.target.id.split("_");
        $('#r_2_'+radioid[2]).attr('checked', 'checked');
        event.preventDefault();
    });

What are you even trying to achieve with that code? I find it very confusing that clicking on the radio buttons doesn't select them. — Felix Kling, Jan 17 '14 at 22:23

score 1 · Accepted Answer · edited May 23 '17 at 12:20

1

Use .prop('checked',true) instead of .attr('checked','checked').

http://jsfiddle.net/5LWEk/

edited May 23 '17 at 12:20

Community

1
1

answered Jan 17 '14 at 22:25

Blazemonger

90,923
26
142
180

score 0 · Answer 2 · answered Jan 17 '14 at 22:35

0

If you want to:

When changing selection in the top row, change value of bottom row accordingly
When changing selection in the bottom row, select the last option in the top row

Then use change event and prop() function, here is the demo

answered Jan 17 '14 at 22:35

n1k1ch

2,594
3
31
35

Dynamically created selectors in jQuery

2 Answers2