I want to show hide data via js on fetched data

Question

I have two pages, first page is having html now i am calling first page html on the second page via jquery and the code is given below.

$(".cat_ring").click(function(){
    var x =$(this).val();
    var alphabet=$('.soganii').val();
    $.ajax({
        url : '******************',
        method : 'POST',
        data : {id:x, alpha:alphabet},
        success : function(data){
            $(".soganiiiii").html(data);
        }
    });
});

now the html part which i am fetching from previous page to new page having one radio button. by which i want to show & hide a div. which i am trying to do by below code.

$('.custom').click(function () {
                    alert();
                  $('#product').show('fast');


            });

             $('#product1').click(function () {
                  $('#product').show('fast');


            });

i can show the previous page html content to new page but my js is not working when i want to use radio button of fetched content. Thanks in advance

score 2 · Accepted Answer · answered Dec 13 '17 at 10:20

You need to delegate your events because you have dynamically added elements

$('.soganiiiii').on('click','.custom',function () {
     alert();
     $('#product').show('fast');


 });

$('.soganiiiii').on('click','#product1',function () {
     $('#product').show('fast');
 });

I want to show hide data via js on fetched data

1 Answers1