CODEWITHSUNDEEP
jquery
Katp00p
Katp00p

Reputation: 93

jquery changing cell color on radio button selection

Just learning jquery and cannot get this to work. I want to change the color of the cell when the "NO" radio button is clicked. This is my best guess as to how it should work, but it is not.

I am loading this table dynamically, so I do not want to give each table cell a unique name. I am trying to just effect the cell that the radio button is contained in using jquery's "this" to avoid using IDs.

<input type="radio" name="group20" value="2" class="spacer" onchange="radio()"> No 


<script>
    function radio() {
        $("td".this).toggleClass("no_checked");
    }
</script>

CSS:

.no_checked {background: #F5A9A9;}

Upvotes: 0

Views: 786

Answers (1)

imbondbaby
imbondbaby

Reputation: 6411

The code below adds and removes the class from the parent td.

JQuery:

$('input:radio[value=0]').click(function () {
    var $this = $(this);
    $this.closest('td').removeClass('no_checked');
});
$('input:radio[value=1]').click(function () {
    var $this = $(this);
    $this.closest('td').removeClass('no_checked');
});
$('input:radio[value=2]').click(function () {
    var $this = $(this);
    $this.closest('td').addClass('no_checked');
});

Demo

Upvotes: 1

Related Questions