javascript - Show items in first list pagination -

i can apply pagination data. don't know how make current active list - in case, first list item shows default doing tabs. first list item shows default without needing click on button/link first in order show content of current active list.

below current codes use:-

1) html code:

$(".pagination li").click(function () {     $(this).toggleclass('active').siblings().removeclass('active');     // hide .block elements     $( ".block" ).hide();     // show .block same index clicked li     $( ".block" ).eq( $( ).index() ).show() }); 

2) css code:

.pagination {    text-align: right;    margin: 0;    padding: 0;    margin: 0 0 10px; } .pagination li {    display: inline-block;    list-style: none;    padding: 10px 15px;    cursor: pointer; } .pagination li.active {    background: #003580;    color: white; }  .block {    display:none; } 

3) html code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul class="pagination">     <li class="first active">1</li>     <li class="second">2</li>     <li class="third">3</li> </ul> <div class="block first">abc</div> <div class="block second">123</div> <div class="block third">!@#</div> 

can show me how this? or maybe other ways this?

just add $( ".block" ).eq( $(".active").index() ).show(); script.

it show contents of active tab

$( ".block" ).eq( $(".active").index() ).show();  $(".pagination li").click(function () {      $(this).toggleclass('active').siblings().removeclass('active');      // hide .block elements      $( ".block" ).hide();      // show .block same index clicked li      $( ".block" ).eq( $( ).index() ).show()  });

.pagination {     text-align: right;     margin: 0;     padding: 0;     margin: 0 0 10px;  }  .pagination li {     display: inline-block;     list-style: none;     padding: 10px 15px;     cursor: pointer;  }  .pagination li.active {     background: #003580;     color: white;  }    .block {     display:none;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <ul class="pagination">      <li class="first">1</li>      <li class="second">2</li>      <li class="third active">3</li>  </ul>  <div class="block first">abc</div>  <div class="block second">123</div>  <div class="block third">!@#</div>