What script I need to radio buttons block to add item in shopping cart?

Hello. When I list my products by .each with radio buttons, how to add script for shopping cart? And what script? If I put before <% end %> I receive many buttons, if after - can’t get ID of product. Help me please. This is my code:

 <form>
<div class="col-md-4 about-left">
<div class="tfood">
  <p><b>Main</b></p>
<table><% @products.each do |i| %>
  <tr>
<td><b><%= i.title %></b>
<%= image_tag i.path_to_image %></td>
<td><i><%= i.discribe %></i></td>
<input type="hidden" <%= i.menu_id %> >
<td><b>Price: <%= i.price %></b>
<input type="radio" name="main" value=<%= i.id %>></td>
<% end %>
</tr>
</table>
</div>
</div>
...
<div>
  <button class="btn btn-md btn-success" onclick="add_to_cart()">Add to Cart</button>
</div>
</form>

<script>
function add_to_cart(id, id2, id3) {
var key = "username's mix(" + id + "," + id2 + "," + id3 + ")";
var x = window.localStorage.getItem(key);
  x++;
  window.localStorage.setItem(key, x);
}
</script>