I'm trying to get the employee name from a table where the row contains data-akfk-type="event">AHOD
with a Tampermonkey userscript.
For example in the table below this should return 'Clare'
and 'Ivan'
as each of those rows has data-akfk-type="event">AHOD
The table will always have two rows that contain 'AHOD'
but they could be on any row in the table.
<table id="iCalTbl" class="groupCalendar">
<tr id="clare@test.com_data_row" data-dp-employeeid="clare@test.com" class="iCalTblRow">
<td data-dp-col="0" class="iCalTblCell iCalTblEmployeeCell" id="header-clare@test.com">
<div class="rowHeaderCell"><a href="#" title="Display employee details" data-akfk-type="employee" id="clare@test.com">
Clare</a> <img src="images/flags/country/spain.png">
</div>
</td>
<td data-dp-col="1" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="2" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
<td data-dp-col="18" class="tblCalendDailyViewMain iCalTblCellNow">.</td>
<td data-dp-col="19" class="tblCalendDailyViewMain iCalTblCellNow">.</td>
<!-- ... -->
<td data-dp-col="29" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="30" class="tblCalendDailyViewMain">
<div data-akfk-type="cell" data-dp-employeeid="clare@test.com">
<div class="shiftlightblue eventDailyContainer" data-akfk-type="eventContainer">
<span id="event_1601787" data-akfk-type="event">AHOD</span></div>
</div>
</td>
<td data-dp-col="31" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
</tr>
<tr id="sally@test.com_data_row" data-dp-employeeid="sally@test.com" class="iCalTblRow">
<td data-dp-col="0" class="iCalTblCell iCalTblEmployeeCell" id="header-sally@test.com">
<div class="rowHeaderCell"><a href="#" title="Display employee details" data-akfk-type="employee" id="sall@test.com">
Sally</a> <img src="images/flags/country/united_arab_emirates.png">
</div>
</td>
<td data-dp-col="1" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="2" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
<td data-dp-col="18" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="19" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
<td data-dp-col="29" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="30" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="31" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
</tr>
<tr id="ivan@test.com_data_row" data-dp-employeeid="ivan@test.com" class="iCalTblRow">
<td data-dp-col="0" class="iCalTblCell iCalTblEmployeeCell" id="header-ivan@test.com">
<div class="rowHeaderCell"><a href="#" title="Display employee details" data-akfk-type="employee" id="ivan@test.com">Ivan</a> <img src="images/flags/country/italy.png">
</div>
</td>
<td data-dp-col="1" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="2" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
<td data-dp-col="18" class="tblCalendDailyViewMain iCalTblCellNow">.</td>
<td data-dp-col="19" class="tblCalendDailyViewMain iCalTblCellNow">.</td>
<!-- ... -->
<td data-dp-col="29" class="tblCalendDailyViewMain">.</td>
<td data-dp-col="30" class="tblCalendDailyViewMain">
<div data-akfk-type="cell" data-dp-employeeid="ivan@test.com">
<div class="shiftlightblue eventDailyContainer" data-akfk-type="eventContainer">
<span id="event_1601789" data-akfk-type="event">
AHOD</span></div>
</div>
</td>
<td data-dp-col="31" class="tblCalendDailyViewMain">.</td>
<!-- ... -->
</tr>
</table>
I've tried:
document.getElementsByClassName("groupCalendar")[0].textContent
which gives me all the text content
" 000102030405060708091011121314151617181920212223Clare AHOD Sally Ivan AHOD "
Then used split on 'AHOD'
to try and grab the value first value by split.
I suspect I need to narrow down my search to a DOM element of the table and not the entire table. Then grab and attribute in the row that matches the search.
I don't know how to search for the keyword 'AHOD'
and then get the name of that employee?