Getting tablerows from whitin a div

Hi guys, I have another problem.

Say that i have a div with id “testdiv” and that div contains a table with id “testresults”. The table rows have servral classes, for example one rows class is “testcase-ok”.

Now here comes the tricky part, I have another table “overviewtestresults” inside another <div> with id “overview”.

And I want to pick out all the table rows in the table “testresults” with id testcase-ok and put them in the "overviewtestresults table.

I have the javascript to hide and show diffrent rows, but how do I acomplish this other task?

Thanks for an amazing forum :slight_smile:

Here a link that describes the problem :slight_smile:

So, #testdiv is invisible?

Could you use a getElementsByClassName(“testcase-ok”) to grab your testcase rows?
(note you’d have to either use a pre-made getElementsByClassName or write one yourself, it doesn’t exist in basic Javascript yet)

with id testcase-ok

You meant class, right?

Then you could use any number of ways to add those tr’s to the other table… you could loop through them (since after gettingElementsByClassName you’ll have a nodeList, a group of elements) and appendChild to the table (or the tbody if your table explicitly has one). Or, I recently learned, you can createDocumentFragment, stuff the tr’s into that, and do one appendChild to the other table.

I have the javascript to hide and show diffrent rows, but how do I acomplish this other task?

I’m going to ask that a mod move this thread over to Javascript, because I believe that yes, you’ll need to use Javascript for this if you want this to happen when a user Does Something (but, you didn’t say). However if you want this done before a page even loads, you’re either asking a question of how to copy-paste in a text editor (I don’t think you are) or how to do this with a back-end language like PHP (I’m also thinking you don’t mean this either).

If you want these rows to move from an invisible table over to another table when the user does something via the browser then go ahead and hit the little flag under your name and in the message box, as a moderator to move this thread over to the correct section. I know this isn’t an HTML/CSS question, you can’t do this without scripting that I know of.

Yes i meant class “test-ok” my bad.

I already have created the getElementsByClassName(“testcase-ok”) javascript so that already works fine.

function hideDisplay(textstring, tag) {
var myclass1 = new RegExp('\\\\b'+textstring+'\\\\b');
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (myclass1.test(allPageTags[i].className)) {

I just wanted to take a row having the class"test-ok" from one table and show it in another table without having to write two exactly same tables contaning exactly the same information. But i will search the appendChild function and see if i can find a sollution using that.

Thanks ur very helpful as always :slight_smile:

and yes testdiv is display.‘none’; :slight_smile:

Done :slight_smile:

Just want to add that the div “testdiv” contains much more than testresults, so i don’t want to show that div. :slight_smile: