javascript - Is it possible to assign borders to an html table dynamically using CSS and the td value of the cell only? -

I have data from a database that is loaded into an HTML table. Because of this, I can not easily add different sections and IDs to TD.

So I have a table of values ​​in a table, call it 1 table. Then I have a second set of values ​​in a different query, in which the values ​​of each "group" are loaded into an html variable which is loaded into a non-displayed table, call this table. I want to use group values ​​in table 2 to assign new boundaries to Table 1. Price does not matter in Table 1.

Therefore, I want to use table 2 values ​​to assign boundaries to Table 2. The values ​​in Table 2 are in this way (if I do not want to change them):

I will specify each group number (for example 1.1) with a fixed border style which is another table I will not be able to understand these things, but sometimes I do not know what to do or not. So please tell me if you have any ideas or if you think that it has not happened right now.

I am able to include javascript, jquery, sql, css and html elements, but this is not a local machine, no php etc. Data comes from a database, so if there is any trick to do something through SQL, keep that idea in mind.

There is an old Bella that is "Table 1" loaded as a variable using HTML table strings (instead of being generated by SQL). It does not currently work, but it shows how it looks.

Slide the sliders and the data will appear.

In Table 1, there is a bunch of values ​​in it. I will load another table, table 2, it will be the value of that group and I want to apply it in Table 1.

Thanks for the help!

Because does not use html variable, I believe you mean javascript variable Let us call the variable that you will store in your group "group".

  var group = document.getElementById ('table2'). Value  

If you want to base your border color for table1, base on the value stored in the field of Table 2, then try something like the following switch (case) statement, of course you can see the actual div ID that you are referring to in Table 2 and in the actual table you specify your table 1. It's just an overview that you can use as a template. For example, if you want to change the border width instead of color, then your code will be blocks document.getElementById ('table1'). Style.borderWidth = "thick"; e.t.c.

 Switch (Group) {Case 0: document.getElementById ('table1'). Style.borderColor = "red"; break; Case 1.1: document.getElementById ('table1'). Style.borderColor = "blue"; break; Case 1.2: document.getElementById ('table1'). Style.borderColor = "yellow"; Default: document.getElementById ('table1'). Style.borderColor = "black";  
}