Añadir a la cesta "a pelo"

[hamramr]

Buenos días.

Trabajo en una web que lleva mucho tiempo hecha y que arrastra una programación un tanto antigua. Está todo hecho "a mano", sin frameworks detrás ni nada por el estilo.

La manera en la que tienen hecho el carrito de la compra es que cuando entras en un artículo, hay varias "líneas" con cada código del artículo, con un campo para añadir la cantidad, y cuando se le da al botón de añadir a la cesta hay una función en javascript que recorre unos campos 'hidden' (todos con los mismos ids, omg, para cada línea) y añade aquellos que tienen un número en la cantidad (sólo hay un botón de añadir a la cesta para todos los elementos de esa página, y lo quieren así).

Por ejemplo, intentaré explicarlo con un esquema.
Supongamos un artículo "camiseta básica", cuando entro a la página tengo un formulario con:

ID Color Cantidad Marca(hidden) Sección(hidden)
1 Rojo Campo de texto Nike X
2 Verde Campo de texto Adidas Y
3 Azul Campo de texto Adidas Z


Así que nosotros vemos los campos ID, Color y Cantidad (los otros vienen ocultos) y por ejemplo, añadimos un 1 el el primer campo de texto y un 2 en el tercer campo de texto.

Repito que cada campo del formulario por cada línea tiene el mismo id y nombre (cielo santo). Así que serían 'cantidad', 'marca', 'seccion' según este ejemplo.

A continuación, una función JavaScript (horrible) recorre todos los elementos del formulario y añade aquellos que tienen una cantidad indicada en el campo de texto. Según el ejemplo que os he dicho añadiría:
1, 1, Nike, X
3, 2, Adidas, Z

Hasta la fecha he trabajado con webs basadas en frameworks u otras con una programación mucho más "moderna". Pero teniendo en cuenta que la opción de incorporar un framework a ésta ahora es inviable, mi pregunta sería:

¿Cuál sería la mejor opción para programar "a pelo" este "Añadir a la cesta"?
Una de las opciones que había pensado es trabajar con atributos "data", pero tengo ciertas dudas de si es la mejor elección.

Muchas gracias.