javascript - Performance vs readability: multiple selectors vs. multiple statements in jQuery/JS -

i'm writing jquery code hides or displays numerous table columns large table @ same time. wanted know if faster use code this:

$("selector 1, selector 2, selector 3").css("display", "none"); 

or code this:

$("selector 1").css("display", "none"); $("selector 2").css("display", "none"); $("selector 3").css("display", "none"); 

so used jsperf.com create performance test case. established first type of code (which uses 1 long string multiple selectors) faster second type of code (which hides columns 1 @ time) 53%. however, time i'm done writing it, borderline unreadable, looking this:

$("#table tr *:nth-child(4), #table tr *:nth-child(5), #table tr *:nth-child(6), #table tr *:nth-child(7), #table tr *:nth-child(8), #table tr *:nth-child(9), #table tr *:nth-child(10), #table tr *:nth-child(11), #table tr *:nth-child(12)").css("display", "none"); 

so question is, greater evil jquery/js code--inefficient performance, or lack of readability? background in python tend value readability above performance, , 53% doesn't seem huge drop-off in real world terms. on other hand, plan minify js code once deploy it, end not being readable anyway...though know there de-minifiers out there can return code original readable or unreadable form. can see can talk myself around in circles on topic, , i'm not looking start debate or discussion, i'm posting here in case there's accepted way of handling in jquery/js community.

maybe have think alternative ways write code , have both worlds. example:

var nth = [4,5,6,7,8,9,10,11,12];  $('#table tr *')   .filter(':nth-child('+ nth.join('),:nth-child(') +')')   .css('display', 'none');