Next and Previous buttons in jquery image gallery

Next and Previous buttons in jquery image gallery

I want to code the next and previous buttons for my jquery image gallery. When i click on next button, it shows me the first image of the gallery and then it stops working for any other image. Can someone help me what i am doung wrong in my code? Please help? Below is jquery.
  2. <script type="text/javascript">
  3.         jQuery(document).ready(function () {
  4.             jQuery('.item').click(function () {
  5.                 // Getting "src" attribute of the image that was clicked.
  6.                 var path = jQuery(this).find('img').attr('src');
  7.                 document.getElementById('tempVal').value = path;
  8.                 // Setting "src" attribute of the big image.
  9.                 jQuery('#big img').attr('src', path);
  10.                 jQuery('#bcktopainting').attr('style', 'display:normal;');
  11.             });
  12.             jQuery('#bcktopainting').click(function () {
  13.                 jQuery('#big img').attr('src', '');
  14.                 jQuery('#bcktopainting').attr('style', 'display:none;')
  15.             });
  16.             jQuery('.next').click(function () {
  17.                 var currentItem = document.getElementById('tempVal').value;
  18.                 currentItem.next();
  19.                 var nextPath = jQuery('ul').find('li').find('img').attr('src', currentItem).next();
  20.                 jQuery('#big img').attr('src', nextPath);
  21.             });
  22.         });
Below is HTML:

  2. <body>
  3.     <input type="hidden" id="tempVal" name="tempValues" value="" style="display: none;" />
  4.     <main class="page payment-page">
  5.         <section class="payment-form dark">
  6.             <div class="container">
  7.                 <div class="block-heading">
  8.                     <a href="Index.aspx">
  9.                         <img src="assets/images/kmac_logo.jpg" />
  10.                     </a>
  11.                     <center>
  12.               <nav class="navbar navbar-default navigation-clean-button" style="width: 350px;">
  13.                 <div class="navbar-header">
  14.                   <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navcol-1"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span>
  15.                     <span class="icon-bar"></span><span class="icon-bar"></span></button>
  16.                   </div>
  17.                   <div class="collapse navbar-collapse" id="navcol-1">
  18.                     <ul class="nav navbar-nav">
  19.                       <li role="presentation"><a href="Painting.aspx">Painting</a></li>
  20.                       <li role="presentation"><a href="Painting2.aspx">Painting 2</a></li>
  21.                       <li role="presentation"><a href="Contact.aspx">Contact</a></li>
  22.                     </ul>
  23.                   </div>
  24.                 </nav>
  25.               </center>
  26.                 </div>
  27.                 <form runat="server" id="big">
  28.                     <img src="" />
  29.                     <div class="card-details">
  30.                         <p id="bcktopainting" style="display: none; float: left;">Back To Painting</p>
  31.                         <p style="" id="prev" onclick="showPrev();">Previous</p>
  32.                         /<p style="" id="next" class="next">Next</p>
  33.                     </div>
  34.                 </form>
  35.                 <section class="gallery-block grid-gallery">
  36.                     <div class="container">
  37.                         <ul class="row" id="row" runat="server">
  38.                         </ul>
  39.                     </div>
  40.                 </section>
  41.             </div>
  42.         </section>
  43.     </main>
  44. </body>
And Below is my ASP.NET code for fetching the images.

  2. public partial class Painting : System.Web.UI.Page
  3.     {
  4.         protected void Page_Load(object sender, EventArgs e)
  5.         {
  6.             imageRetriever();
  7.         }

  9.         private void imageRetriever()
  10.         {
  11.             StringBuilder table = new StringBuilder();
  12.             foreach (string strFileName in Directory.GetFiles(Server.MapPath("PaintingPagePictures/")))
  13.             {
  14.                 FileInfo fileInfo = new FileInfo(strFileName);
  15.                 table.Append("<li class=\"col-md-6 col-lg-4 item\">");
  16.                 table.Append("<img class=\"img - fluid image scale - on - hover\" src=\"PaintingPagePictures/" + fileInfo.Name + "\" />");
  17.                 table.Append("</li>");
  18.             }
  19.             row.InnerHtml = table.ToString();
  20.         }
  21.     }