title: Change element contents depending on current database record in Ruby on Rails
body: <p>Please refer to the image below to have an idea of the look.</p>
  
  <p>I have a database in ruby on rails named sauces.</p>
  
  <p>The fields in the sauces table are as follows:</p>
  
  <ul>
  <li>id</li>
  <li>name</li>
  <li>description</li>
  <li>picture</li>
  </ul>
  
  <p>This is my css:</p>
  
  <pre><code>#container{width:950px;height:800px;}
  #title{this_is:irrelevant;}
  #sauce_picture{bla bla}
  #sauce_name{bla bla}
  #sauce_splatter{background-image:url("someimage.png")}
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;html&gt;
   &lt;body&gt;
    &lt;div id="container&gt;
     &lt;div id="title&gt;&lt;h1&gt;SAUCES&lt;/h1&gt;&lt;/div&gt;
     &lt;div id="sauce_picture&gt;&lt;img src="somepic.png/&gt;&lt;/div&gt;
     &lt;div id="sauce_name&gt;&lt;h2&gt;Sauce 1&lt;/h2&gt;&lt;/div&gt;
     &lt;div id="sauce_splatter&gt;
       &lt;p&gt;Sauce Description Goes Here&lt;/p&gt; 
     &lt;/div&gt;
    &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Okay, the rails database table has 6 records with each field present. What I want to achieve is that say the page is loaded. I want the record to be at record number one, where the contents of<code>&lt;img src="somepic.png/&gt;</code> , <code>&lt;h2&gt;Sauce 1&lt;/h2&gt;</code> , <code>&lt;p&gt;Sauce Description Goes Here&lt;/p&gt;</code> are all retrieved from the database table because the count starts at one. </p>
  
  <p>I do not know how to make it so that when the right arrow is pressed the id becomes two and the contents of the above change to what is present in record number 2 (id=2).</p>
  
  <p>Lastly how would I do it so that, if the id=1 (i.e. first record, the left arrow becomes disabled as a link, and when the last record is present the right arrow becomes disabled. 
  This would be achieved by changing the elements using JQuery, but how can I use Rails and Jquery together.</p>
  
  <p>This way I wouldn't have to change any code if I add a new sauce in the database table in the future, after all thats the whole point of MCV.</p>
  
  <p>Thanks</p>
  
  <p><img src="https://i.stack.imgur.com/SJcDz.png" alt="The image"> </p>