Let us say you have the following element.
<div id='myDiv' class='myClass' name='myName' data='myData'>...</div>
Typically, we select div using its ID attribute as shown below.
$('#myDiv') or $('.myClass')
var id='#myDiv'; var class='.myClass'; $(id) OR $(class)
Or you can define the ID or classname and concatenate it with # or dot(.) operator.
var id='myDiv'; var class='myClass'; $('#'+id) OR $('.'+class)
You can also use this approach to select multiple elements using multiple variables, as shown below. Please note, in this case, we will be use comma to separate individual selectors.
var id1='myDiv1'; var id2='myDiv2'; var class1='myClass1'; var class2='myClass2'; $('#'+id1+',#'+id2) //#myDiv1,#myDiv2 OR $('.'+class1+',.'+class2) //#myClass1,#myClass2
Similarly, you can also define JS variables for name and use it in jQuery selector as shown below.
var name='myName'; $('div[name='+name+']')
You can also use the same approach for defining variables for other HTML attributes and properties and use them in jQuery selector.
var data='myData'; $('div[data='+data+']')