JSFiddle - React, Tailwind, and code Playground

by Tushar Jadhav

HTML

<label id="income_this_tax_year">
    <div class="left">
        <p>Have you had Self-Employment, Sole Trade or CIS income during the tax year?</p>
    </div>
    <div class="right">
        <input type="radio" name="income_this_tax_year" value="yes" />
        <input type="radio" name="income_this_tax_year" value="no" />
        <button type="button" data-value="yes" class="button">Yes</button>
        <button type="button" data-value="no" class="button">No</button>
    </div>
    <div class="float-clear"></div>
</label>

JavaScript

$(document).ready(function () {

    $('button').on('click', function (e) {
        e.preventDefault();
        var option = $(this).parent('.right').parent('label').attr('id');
        var value = $(this).data('value');

        $('#' + option).find('input[type=radio]').prop('checked', false);

        $('#' + option + ' input[value=' + value + ']').prop('checked', true);

        var income_this_tax_year = $('input[name=income_this_tax_year]:checked').val();

        console.log(income_this_tax_year);
    })

});