How to do a trigger event only for the first element in the Menu

On page load up , i need to do a trigger call on the menu

I need to do it only for the first element that is Bottle in my case

<div class="swiper-wrapper" id="swipecontainer">
  <div class="swiper-slide swiper-slide-visible swiper-slide-active"><span>Bottle</span>
  </div>
  <div class="swiper-slide swiper-slide-visible"><span>Cool Drinks</span>
  </div>
</div>

This is my code

$(document).on("click", ".swiper-slide", function (event) {
  alert('Clciked');
  event.stopPropagation();
  event.preventDefault();
  event.stopImmediatePropagation();
});
$(".swiper-slide").trigger("click");

http://jsfiddle.net/7d060586/1/

The problem i am facing is that it is doing a trigger call for all the items present in the menu

Could you please let me know how to d it only for the first item of the Menu .


solution

Either use :first, .first() or .eq(0):

$("#swipecontainer .swiper-slide:first").trigger("click");

Example Here


$("#swipecontainer .swiper-slide").first().trigger("click");

Example Here


  $("#swipecontainer .swiper-slide").eq(0).trigger("click");

Example Here