clickイベントをchildnodeに付けることはできませんが、IDに直接アクセスできますか？

Question

子ノードにアクセスすることで特定の要素をターゲットにしようとするとジレンマが発生します。クリックイベントは機能しませんが、getElementByIdを使用すると動作しますが、理想的には子ノードを経由する必要があります。以下は私のコードです。

jQuery('#begin_consult').click(function(){ 
    jQuery('.cq-container').show(); 
    jQuery('#begin_consult').hide(); 
    if(jQuery('.option').hasClass('c_questions')){ 
     var y = document.getElementsByClassName('c_questions'); 
     for(var i = 0; i < y.length; i++){ 
      jQuery('.main-body').append(y[i].innerHTML); 

      var get_age_gparent = document.getElementsByClassName('age-check')[0]; 
      get_age_gparent.style = "display:block;"; 
      var get_age_parent = get_age_gparent.childNodes[1]; 
      var getOptionsDD = get_age_parent.childNodes[3]; 
      var getOptionsUL = getOptionsDD.childNodes[1]; 
      var getInputNo = getOptionsUL.childNodes[1]; 
      var getRadioBtnAge = getInputNo.childNodes[0]; 
      getRadioBtnAge.onclick = function(){ 
      alert('fffff'); 
     }; 
    } 

} 

}); 

Answer 1

別のアプローチを使用することをお勧めします。現在の実装では、HTMLの構造に厳密に依存したコードになります。少しでも変えてしまえば、それは壊れます。 divに画像、アイコンを追加したり、要素を折り返したりすることができます。 私はあなたの場合、私は別の方法でそれらを参照します。 （、「クリック 『に

var get_age_gparent = jQuery('.age-check').first(); 
get_age_gparent.css({'display':'block'}); 
var get_age_parent = get_age_gparent.find('.ageparent');//add new class on target 
var getOptionsDD = get_age_parent.find('.optionsdd');//add new class on target 
var getOptionsUL = getOptionsDD.find('.optionsUL');//add new class on target 
var getInputNo = getOptionsUL.find('.inputNo');//add new class on target 
var getRadioBtnAge = getInputNo.find('input[type=radio].btnage');//add btnage classname to target button 
getRadioBtnAge.click(function(){ 
alert('fffff'); 
});