title: How to select HTML element that has "data-name"
body: <p>I've tried a few suggestions from google but it's not working for me. I have a table and each tr has one td that has style set to none, i.e. it's invisible.</p>
  
  <p>This is the html:</p>
  
  <pre><code>&lt;tr class="grid-row grid-row-selected"&gt;
  &lt;td class="grid-cell" data-name="ChkSelected" style="display: none;"&gt;&lt;input id="chkBulk" name="chkBulk" type="checkbox" value="true"&gt;&lt;input name="chkBulk" type="hidden" value="false"&gt;&lt;/td&gt;&lt;td class="grid-cell" data-name="Id"&gt;6382&lt;/td&gt;&lt;td class="grid-cell" data-name="MembershipNumber"&gt;74073565&lt;/td&gt;&lt;td class="grid-cell" data-name="DateReceived"&gt;24/07/2014 00:00:00&lt;/td&gt;&lt;td class="grid-cell" data-name="Fullname"&gt;Esther Hills&lt;/td&gt;&lt;td class="grid-cell" data-name="ApplicationType"&gt;CEng&lt;/td&gt;&lt;td class="grid-cell" data-name="FirstCheckDoneBy"&gt;chrisw&lt;/td&gt;&lt;td class="grid-cell" data-name="AssignedStaffMem"&gt;&lt;b&gt;
  &lt;select id="ddlStaff" name="ddlStaff"&gt;&lt;option value="susang"&gt;Susan Goulding&lt;/option&gt;
  &lt;option value="kevinm"&gt;Kevin Murphy&lt;/option&gt;
  &lt;option value="fionas"&gt;Fiona Spinks&lt;/option&gt;
  &lt;option value="marilynw"&gt;Marilyn Wharton&lt;/option&gt;
  &lt;option value="pamellar"&gt;Pamella Rivadulla-Rey&lt;/option&gt;
  &lt;option value="SARAHS"&gt;Sarah Saw&lt;/option&gt;
  &lt;option value="warrenjl"&gt;Warren John-Lewis&lt;/option&gt;
  &lt;option value="carolinh"&gt;Carolin Harvey&lt;/option&gt;
  &lt;option value="RACHAELB"&gt;Rachael Boysen&lt;/option&gt;
  &lt;option value="katem"&gt;Kate MacGregor&lt;/option&gt;
  &lt;option value="christ"&gt;Christiaan Thelen&lt;/option&gt;
  &lt;/select&gt;
             &lt;/b&gt;
  &lt;/td&gt;&lt;td class="grid-cell" data-name=""&gt;&lt;b&gt; &lt;a href="#" onclick="AssignStaff(6382, &amp;quot; Esther Hills &amp;quot;, 6382)"&gt;
           Assign&lt;/a&gt; &lt;/b&gt;
  &lt;/td&gt;    &lt;/tr&gt;
  </code></pre>
  
  <p>I want to change this:</p>
  
  <pre><code>&lt;td class="grid-cell" data-name="ChkSelected" style="display: none;"&gt;
  </code></pre>
  
  <p>So it's visible so the user can click the checkbox.</p>
  
  <p><strong>This is my code</strong></p>
  
  <pre><code> $(document).ready(function () {
              if ($(AssignOnBulk).is(':checked')) {
                  $("#bulkAssign").show();
                  alert($('td [data-name="ChkSelected"]').html());
                  $('td.grid-cell [data-name="ChkSelected"]').show();
              }
              else {
                  $("#bulkAssign").hide();
                  $('[data-name="ChkSelected"]').hide();
              }
          });
  </code></pre>
  
  <p>This line is supposed to set all tds with data-name to style=diplay:block</p>
  
  <pre><code>  $('td.grid-cell [data-name="ChkSelected"]').show();
  </code></pre>
  
  <p>Anyone know to select elements with "data-name" attribute?</p>