показать/скрыть один DIV из нескольких кнопок

Question

У меня есть следующие JS для переключения класса show_div:

$(document).ready(function(){ 

    $(".slidingDiv").hide(); 
    $('.show_div').show(); 

    $('.show_div').click(function(){ 
    $(".slidingDiv").slideToggle(); 
    }); 
}); 

У меня есть следующий HTML, который вызывает класс show_div:

<div> 
<a href="#" data-color="red" class="show_div"><img src="../red.png" /></a> 
<a href="#" data-color="blue" class="hide_div"><img src="../blue.png" /></a> 
</div> 

Когда я нажмите на ссылку red.png, появится show_div. Я не могу понять, как заставить show-div скрыть, когда я нажму ссылку blue.png.

Когда я добавляю класс в blue.png, чтобы скрыть show_div, он в конечном итоге скрывает blue.png. Red.png должен показать/скрыть show_div. В то время как blue.png должен убедиться, что show_div скрыт.

добавил код:

<div class="slidingDiv"> 
<div class="show_div"> 
<a onClick="window.open('listing.html','_blank');">this is red</a> 
</div> 
</div> 

Answer 1

Try:

$("a").click(function(){ 
    $(".slidingDiv").slideToggle(); 
    }); 

DEMO FIDDLE

Answer 2

$("a").click(function(){ 
$(".slidingDiv").slideToggle(); 
}); 

Вам нужно прикрепить событие к тегу, не существует ни одного события на шкуре в настоящее время