куча радио-кнопок и хотите включить переключатель на одной из них

Question

Я использую vanilla javascript на переключателях, чтобы показать / скрыть блок tr с идентификатором для выбора радио и на unselect радио, скрыть этот кусок ..

vanilla js работает нормально, хочу перейти на jquery, чтобы попробовать то же самое в jquery, но я немного потерялся здесь

, поэтому у каждого радио есть свой идентификатор, прикрепленный к нему без класса. и я хочу показывать только радио id10, если отмечено, если выбрано любое другое радио, я хочу скрыть этот div, как я могу сделать в jquery

для javascript я делаю это

function toggle() {
              var x = document.getElementById("myDIV");
              if (x.style.display === "none") {
                x.style.display = "block";
              } else {
                x.style.display = "none";
              }
            }

пробовал вот так:

но он даже ничего не делает

даже не предупреждение

$(document).ready(function() {
                $("#myDiv").hide();
                $('input[name="outputFormat"]').click(function() {
                    alert("hi");
                    let id = $(this).attr('id');
                    if(id == 'of9') {
                        $("#myDiv").show();
                    }else {
                        $("#myDiv").hide();
                    }
                });
            }

Answer 1

Вы можете настроить таргетинг на rad ios, используя селектор атрибутов с желаемым именем группы. Затем вы можете использовать .is(), чтобы проверить, соответствует ли текущий элемент вашему селектору (например, Element.matches в ванили), а затем переключить видимость с помощью служебных функций .show() и .hide.

$('input[name="sel"]').on('change', function() {
  if ($(this).is('#id10')) {
    $('#myDiv').show();
  } else {
    $('#myDiv').hide();
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" name="sel" value="1">
<input type="radio" name="sel" value="2" id="id10">
<input type="radio" name="sel" value="3">

<div id="myDiv">Content</div>