A page is showing a list of a company's customers. The HTML markup for each row is generated by JS from JSON data. Each entry is editable inline and the changes are saved to the JSON data and later pushed to the server.
I think it should be structured this way:
On load, the JSON data gets parsed and a "customers"-variable now holds a bunch of "Customer"-objects. The markup for each customer should be created by a method of the Customer class and appended somewhere in the page. The newly created markup and the Customer object should hold a reference to each other and the Customer object should keep a log of which state the markup is in (no markup, show or edit).
What do you think of this structure? Is there a better, known, proven practice? How do you deal with such applications?