Jquery, если еще заявление не работает в Google Chrome или Safari

Question

Попытка получить всплывающее окно при выборе определенных значков.

Проблемы: 1.) Это прекрасно работает в FF, но не где-нибудь еще. Иногда он работает в хроме, когда я проверяю элемент. 2.) Должен быть более короткий способ написания этого кода ...?

$(window).load(function(){
    var $quickview = $(".quickview");


$('.quickview').click(function() {
    var $t = $(this).parents("a");

    if($t.is(":nth-child(1)")){
        var css={}
        $("#overlay1").css("display","block");
        console.log("1")
        }
    else if($t.is(":nth-child(2)")){
        var css={}
        $("#overlay2").css("display","block");
        console.log("2")
        }
    else if($t.is(":nth-child(3)")){
        var css={}
        $("#overlay3").css("display","block");

        }
    else if($t.is(":nth-child(4)")){
        var css={}
        $("#overlay4").css("display","block");
        }
    else if($t.is(":nth-child(5)")){
        var css={}
        $("#overlay5").css("display","block");
        }
    else if($t.is(":nth-child(6)")){
        var css={}
        $("#overlay6").css("display","block");
        }
    else if($t.is(":nth-child(7)")){
        var css={}
        $("#overlay7").css("display","block");
        }
    else if($t.is(":nth-child(8)")){
        var css={}
        $("#overlay8").css("display","block");
        }
    else if($t.is(":nth-child(9)")){
        var css={}
        $("#overlay9").css("display","block");
        }
    else if($t.is(":nth-child(10)")){
        var css={}
        $("#overlay10").css("display","block");
        }

$('.exit, .overlay').click(function() {


    if($t.is(":nth-child(1)")){
        var css={}
        $("#overlay1").css("display","none");
        }
    else if($t.is(":nth-child(2)")){
        var css={}
        $("#overlay2").css("display","none");
        }
    else if($t.is(":nth-child(3)")){
        var css={}
        $("#overlay3").css("display","none");
        }
    else if($t.is(":nth-child(4)")){
        var css={}
        $("#overlay4").css("display","none");
        }
    else if($t.is(":nth-child(5)")){
        var css={}
        $("#overlay5").css("display","none");
        }
    else if($t.is(":nth-child(6)")){
        var css={}
        $("#overlay6").css("display","none");
        }
    else if($t.is(":nth-child(7)")){
        var css={}
        $("#overlay7").css("display","none");
        }
    else if($t.is(":nth-child(8)")){
        var css={}
        $("#overlay8").css("display","none");
        }
    else if($t.is(":nth-child(9)")){
        var css={}
        $("#overlay9").css("display","none");
        }
    else if($t.is(":nth-child(10)")){
        var css={}
        $("#overlay10").css("display","none");
        }
    });
});

});

Пожалуйста, помогите! Спасибо!

Answer 1

вы пробовали что-то подобное

$('.quickview').click(function() {
    var i = ( $(this).parents("a").index() + 1 );
     $("#overlay"+ i).css("display","block");
     console.log(i);

});