javascript - jQuery Having multiple on click events -

i have calendar , running, have more.. button on each day if there more events 3. once button clicked drop-down appears , shows other events in day.

its getting correct data each dropdown if click button triggers on click open.

jquery:

 <script>  function deselect(e) {  $('.pop').slidefadetoggle(function() {    e.removeclass('selected');  }); }  $(function() {   $('[id^=contact]').on('click', function() {    if($(this).hasclass('selected')) {      deselect($(this));        } else {   $(this).addclass('selected');     $('.pop').slidefadetoggle();     }     return false;   });    $('.close').on('click', function() {     deselect($('#contact'));     return false;   }); });  $.fn.slidefadetoggle = function(easing, callback) {   return this.animate({ opacity: 'toggle', height: 'toggle' }, 'fast', easing,     callback);   }; </script> 

html + django

{% if forloop.counter|divisibleby:2 %}     <a href="/contact" id="contact{{     forloop.counter }}" class="popup"><small>more...<small></a>     <div class="messagepop pop"> {% endif %}  <p class="alert" style="background- color: #{{ occurrence.event.category.color }}">     <a title="{{ occurrence }}" href="{% url "calendar_occurrence_detail" pk=occurrence.event.pk year=occurrence.start.year month=occurrence.start.month day=occurrence.start.day %}">{{ occurrence|truncatechars:22 }}</a> </p> {%if forloop.last%}     </div> {% endif %} 

i'm not best @ jquery might simple others cant seem figure out

thanks in advance! jf

edit - hover div + data created in loop

you use .next() selector method in click handler on current clicked button
( $(this) ).

just change

$('.pop').slidefadetoggle(); 

to

$(this).next().slidefadetoggle();