Как я показываю стрелу только к выбранному элементу JQuery

Question

У меня есть такой пример:

https://jsfiddle.net/6yg8ckno/

HTML:

<div class="patrat1 inline"> 
    <p class="menu1"><img class="sageata" src="http://paul.dac-proiect.ro/wp-content/themes/wpbootstrap/images/logo-arrow.png">MENU1</p> 
    <p class="menu1"><img class="sageata" src="http://paul.dac-proiect.ro/wp-content/themes/wpbootstrap/images/logo-arrow.png">MENU2</p> 
    <p class="menu1"><img class="sageata" src="http://paul.dac-proiect.ro/wp-content/themes/wpbootstrap/images/logo-arrow.png">MENU3</p> 
</div> 

JS:

$(document).ready(function() { 
    $('.patrat2 .content2').hide(); 
    $('.patrat1 p img').hide(); 
    $('.patrat1 p:first-child img').show(); 

    $('.patrat1 p').click(function() { 
     var clicked = $(this); 
     $('.patrat1 p img').show(); 
     $('.patrat1 p:first-child img').hide(); 
    }); 
}); 

Я wa nt, когда пользователь нажимает на элемент, стрелка отображает и скрывает остальные. К сожалению, мой пример неполный, и я застрял в этом пункте.

Можете ли вы дать мне несколько советов о том, как вы должны действовать?

Заранее благодарен!

Answer 1

Попробуйте this:

$('.patrat1').on('click', 'p', function() { 
    $('.sageata').hide(); 
    $(this).find('.sageata').show(); 
}); 

$(this) внутри обработчика событий является p элементом, была нажата.

Демо: https://jsfiddle.net/tusharj/6yg8ckno/1/

Answer 2

Во-первых, скрыть все .sageata без исключения, то вы показываете .sageata в щелкнул p элемент. И это все! :)

$('.patrat1 p').click(function(){ 
     $(".sageata").hide(); 
     $('.sageata', this).show(); 
    }); 

https://jsfiddle.net/6yg8ckno/3/