Как сделать кнопку отображаться после нажатия скрытой кнопки?

Question

Я делаю страницу используя html, css и jquery. Я хочу, чтобы кнопка была видимой после нажатия кнопки, которая была скрыта перед использованием .hide(); функция. При загрузке страницы скрывается множество кнопок, поэтому, когда я нажимаю кнопку 1, другие кнопки из .hide становятся .show при нажатии. Но я хочу сделать еще одну кнопку .show после нажатия на другую кнопку .show, которая была нажата после скрытия. Когда я пытаюсь его реализовать, все кнопки просто появляются на странице, и это становится хаосом.

$(document).ready(function() { 
    $("#Speedtrapknapp").hide(); 
    $("#Politihovedknapp").hide(); 
    $("#Accidentknapp").hide(); 
    $("#Trafficjamknapp").hide(); 
    $("#visibletrap").hide(); 
    $("#hiddentrap").hide(); 
    $("#smallBtn").hide(); 
    $("#mediumBtn").hide(); 
    $("#bigBtn").hide(); 
    $("#vehicleinspectBtn").hide(); 
    $("#alcoholBtn").hide(); 
    $("#speedBtn").hide(); 
    $("#tagBtn1").hide(); 

    $("#Speedtrap1").click(function() { 
     $("#visibletrap").show(); 
     $("#hiddentrap").show(); 
     $("#Speedtrapknapp").show(); 
     $("#Politihovedknapp").hide(); 
     $("#Accidentknapp").hide(); 
     $("#Trafficjamknapp").hide(); 
     $("#smallBtn").hide(); 
     $("#mediumBtn").hide(); 
     $("#bigBtn").hide(); 
     $("#vehicleinspectBtn").hide(); 
     $("#alcoholBtn").hide(); 
     $("#speedBtn").hide(); 
     $("tagBtn1").hide(); 

    }); 

    $("#Policecontrol1").click(function() { 
     $("#alcoholBtn").show(); 
     $("#vehicleinspectBtn").show(); 
     $("#SpeedBtn").show(); 
     $("#Speedtrapknapp").hide(); 
     $("#Politihovedknapp").show(); 
     $("#Accidentknapp").hide(); 
     $("#Trafficjamknapp").hide(); 
     $("#visibletrap").hide(); 
     $("#hiddentrap").hide(); 
     $("#smallBtn").hide(); 
     $("#mediumBtn").hide(); 
     $("#bigBtn").hide(); 
     $("#speedBtn").show(); 
     $("tagBtn1").hide(); 
    }); 

    $("#TrafficJam1").click(function() { 

     $("#Speedtrapknapp").hide(); 
     $("#Politihovedknapp").hide(); 
     $("#Accidentknapp").hide(); 
     $("#Trafficjamknapp").show(); 
     $("#visibletrap").hide(); 
     $("#hiddentrap").hide(); 
     $("#smallBtn").show(); 
     $("#mediumBtn").show(); 
     $("#bigBtn").show(); 
     $("#vehicleinspectBtn").hide(); 
     $("#alcoholBtn").hide(); 
     $("#speedBtn").hide(); 
     $("tagBtn1").hide(); 
    }); 

    $("#Accident1").click(function() { 

     $("#Speedtrapknapp").hide(); 
     $("#Politihovedknapp").hide(); 
     $("#Accidentknapp").show(); 
     $("#Trafficjamknapp").hide(); 
     $("#visibletrap").hide(); 
     $("#hiddentrap").hide(); 
     $("#smallBtn").show(); 
     $("#mediumBtn").show(); 
     $("#bigBtn").show(); 
     $("#vehicleinspectBtn").hide(); 
     $("#alcoholBtn").hide(); 
     $("#speedBtn").hide(); 
     $("tagBtn1").hide(); 
    }); 

    $("#Clear1").click(function() { 

     $("#Speedtrapknapp").hide(); 
     $("#Politihovedknapp").hide(); 
     $("#Accidentknapp").hide(); 
     $("#Trafficjamknapp").hide(); 
     $("#visibletrap").hide(); 
     $("#hiddentrap").hide(); 
     $("#smallBtn").hide(); 
     $("#mediumBtn").hide(); 
     $("#bigBtn").hide(); 
     $("#vehicleinspectBtn").hide(); 
     $("#alcoholBtn").hide(); 
     $("#speedBtn").hide(); 
     $("tagBtn1").hide(); 
    }); 

});  

Я попытался с

$("smallBtn").click() 
("tagBtn1").show; 

, но он не работает. Я хочу, чтобы «tagBtn1» появился после нажатия «smallBtn», «mediumBtn» osv.

Answer 1

использовать знак # перед выбором элемента с идентификатором в JQuery и анонимной функции должны быть пройти в круглых скобках (т.е. нажмите (функция() {})) то есть:

$("#smallBtn").click(function(){ 
    ("#tagBtn1").show(); 
});