<table class="prodTable">
<tr>
<td></td>
<td>Camaro</td>
<td>96-97</td>
<td>5.7L LT1</td>
<td>1-3/4"</td>
<td>3"</td>
<td>
<p class="designNotes">6, 9, 10,</p> <!--Insert actual note labels to retrieve proper results -->
</td>
<td class="partno">82-1161</td>
</tr>
<tr>
<td></td>
<td>Camaro</td>
<td>98-99</td>
<td>5.7L LS1</td>
<td>1-3/4"</td>
<td>3"</td>
<td>
<p class="designNotes">2, 3, 9, </p>
</td>
<td class="partno">82-1163</td>
</tr>
<tr>
<td></td>
<td>Camaro</td>
<td>98-02</td>
<td>5.7L LS1</td>
<td>1-3/4"</td>
<td>3"</td>
<td>
<p class="designNotes">1, 4, 5,</p>
</td>
<td class="partno">82-1163</td>
</tr>
</table>
var modal = document.getElementById('designNotesModal');
var p = document.getElementById("designNotes"); // Get the element that opens the modal
var span = document.getElementsByClassName("close")[0]; // Get the button that opens the modal
p.onclick = function() { modal.style.display = "block";} // When the user clicks on the button, open the modal
span.onclick = function() { modal.style.display = "none";} // When the user clicks on <span> (x), close the modal
window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; }}
// When the user clicks anywhere outside of the modal, close it
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("desgnNotes"); //Get the Search criteria
filter = input.value.toUpperCase(); //Initiate filter - need to be able to join search criteria
table = document.getElementById("desgnTable"); //Get the product table within the modal
tr = table.getElementsByTagName("tr"); //loop through the table
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0]; // find the correct results
if (td) { if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else { tr[i].style.display = "none"; // display correct results
} } } }
Modal and working selector<p id="designNotes">1,2,3,4</p>
<div id="designNotesModal" class="modal2">
<div class="modal-content-Notes">
<div class="modal-body-Notes">
<table id="desgnTable" cellspacing="0" cellpadding="0">
<col span="2">
<tr>
<td>1,</td>
<td> Flanged Collector</td>
</tr>
<tr>
<td>2,</td>
<td> Slip-fit Collector</td>
</tr>
<tr>
<td>3,</td>
<td> Hook-ups for smog </td>
</tr>
<tr>
<td>4,</td>
<td> No smog hook-ups</td>
</tr>
</table>
</div></div></div>
Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.
”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.
Our community of experts have been thoroughly vetted for their expertise and industry experience.
The Distinguished Expert awards are presented to the top veteran and rookie experts to earn the most points in the top 50 topics.