Select multiple rows using multiple data attribute I am hiding rows for given ids using this code:

var idArray = ['A123','B456']; // getting from web services
for (var i=0;i&lt;idArray.length;i++) {
   var id = idArray[i];
   $("#eTable tr[data-empid=" + id + "]").hide();
}


HTML (Just for example doesn't needs improvement)

&lt;table id="eTable"&gt;
    &lt;tr data-empid="A123" data-salary="120" data-status="drone"&gt;
        &lt;td&gt;Peter&lt;/td&gt;
        &lt;td&gt;Vogel&lt;/td&gt;
        &lt;td&gt;Principal&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr data-empid="B456" data-salary="130" data-status="worker"&gt;
        &lt;td&gt;Jan&lt;/td&gt;
        &lt;td&gt;Vogel&lt;/td&gt;
        &lt;td&gt;General Manager&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr data-empid="C789" data-salary="110" data-status="worker"&gt;
        &lt;td&gt;Jason&lt;/td&gt;
        &lt;td&gt;van de Velde&lt;/td&gt;
        &lt;td&gt;Company nurse&lt;/td&gt;
    &lt;/tr&gt;
&lt;/table&gt;


How can we improve this code as it is selecting same table again and again to get row one by one instead of getting them once?
The performance benefits vary depending on the browser's implementation of ECMAScript, but you can usually get a modest performance improvement by selecting the parent element first, then selecting only child elements of that parent element. This jsPerf test somewhat demonstrates the difference.

In native JavaScript, this is done by selecting the parent element with document.querySelector, document.getElementById, or document.getElementsByTagName. You can then call a similar selector method on that element instead of on document to limit your search to only child elements.

Native

var idArray = ['A123','B456']; 
var table = document.querySelector("#eTable");
for(var i = 0; i &lt; idArray.length; i++){
    table.querySelector("tr[data-empid='"+idArray[i]+"']").style.display = "none";
}


In jQuery, you can achieve the same using jQuery(parentElement).find(selector) or $(parentElement).find(selector)

jQuery

var idArray = ['A123','B456']; 
var table = $("#eTable");
for(var i = 0; i &lt; idArray.length; i++){
   $(table).find("tr[data-empid='"+idArray[i]+"']").hide();
}