Hide html element based on every attribute value jquery

Question

I have the following ticket table in which I'd like to hide the ticket ID, yellow highlited.

By inspecting the code, this can be achived as hiding every element with any value specified by the attribute data-test-ticket-id in the span class.

<td>
    <div>
        <span data-test-ticket-id="2595" class="muted">
        #2595
        </span>
    </div>
</td>

The coded table can be found here: https://jsfiddle.net/f6qkgL54/

I tried td.div.span { display: none !important; }. I think the best method would be using jquery but I have some difficulties.

Edit

I can't use .muted { display: none; } because it is used almost everywhere in the system so it will hide important elements

Hi, Since you have notified that yiu have other muted element elsewhere in the page - please see my updated answer below which will only hide the muted class from the table you have. I have added two demo span's outside as well to show that they are not being hidden but the ticket ID;'s are not showing anymore. — Always Helping
– Always Helping, Commented Sep 25, 2020 at 14:06
Hi! I really appreciate your help. Is there a way to generate dynamic css using that function? I.e. inject dyamically {display: none} — Nick
– Nick, Commented Sep 27, 2020 at 12:55

Always Helping · Accepted Answer · 2020-09-25 14:05:17Z

You can simply use jQuery $.each on your .muted class and hide all the span using .hide() method

Edit: See my updated answer below which will only hide the muted class from the table you have. I have added two demo span's outside as well to show that they are not being hidden but the ticket ID;'s are not showing anymore.

$('table tbody tr td').each(function(){
   $(this).find('span.muted').hide() //hide all spans with ticket id's only from table
})

Demo:

$('table tbody tr td').each(function(){
    $(this).find('span.muted').hide() //hide all spans with ticket id's only from table
})

.muted {
  background: green;
  color: white
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="">
  <tbody class="lt-body">
    <!---->
    <tr data-test-id="ticket-row-2595" data-row-id="ember2353" colspan="1" id="ember2354" class="lt-row is-selectable current__item--active ember-view">
      <td style="width: 50px" id="ember2355" class="lt-cell align-left ember-view">
        <div id="ember2356" class="ember-view">
          <div data-test-id="table-checkbox" id="ember2357" class="input __ui-form__custom-checkbox custom-checkbox ember-view"><input data-test-checkbox="ticket-checkbox-ember2357" id="checkbox-ember2357" class="trigger-shortcuts ember-checkbox ember-view" type="checkbox">
            <label for="checkbox-ember2357">
              <span class="label-field"></span>
            </label>
          </div>
        </div>
      </td>
      <td style="width: 12vw" id="ember2358" class="lt-cell align-left ember-view">
        <div data-test-id="customer_test_label" id="ember2359" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div class="avatar-info-cell">
            <div class="avatar-image">
              <figure data-test-user-avatar="" id="ember2361" class="profilepic  avatar-icon avatar-icon--small avatar-icon--circle ember-view"> <span data-test-avatar-text="profile_font_text" id="ember2362" class="avatar-block avatar__initial avatar__initial--3 ember-view"><span class="avatar__initial--icon-wrapper">
                    A
                  </span>
                </span>

                <!---->
              </figure>
            </div>
            <div data-test-id="table-view-contact" id="ember2363" class="avatar-text text__content requester-hover ember-view">
              <div id="ember2364" class="ember-view">
                <div data-test-id="user-link" aria-owns="ember-basic-dropdown-content-ember3925" tabindex="0" data-ebd-id="ember3925-trigger" role="button" id="ember3926" class="ember-basic-dropdown-trigger ember-view"> <a href="/a/contacts/77039479587" data-test-id="user-name" class="user">
                    Anyonio M
                  </a>

                </div>
                <div id="ember-basic-dropdown-content-ember3925" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>



              </div>
            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 30px" id="ember2366" class="lt-cell align-left lt-cell-autorefresh ember-view">
        <!---->
      </td>
      <td style="width: 24vw" id="ember2368" class="lt-cell align-left ember-view">
        <div data-test-id="subject_test_label" id="ember2369" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div id="ember2370" class="pr-12 ticket-listview-hover __module-tickets__tickets-list__tickets-table__ticket-subject-popover ember-view">
            <div id="ember2371" class="ember-view">
              <div data-test-id="ticket-subject-hover-2595" aria-owns="ember-basic-dropdown-content-ember3809" tabindex="-1" data-ebd-id="ember3809-trigger" role="button" id="ember3810" class="trigger-shortcuts ember-basic-dropdown-trigger ember-view"> <a data-test-link="tickets-subject-2595" href="/a/tickets/2595" id="ember3811" class="link-on-hover link-no-underline wordbreak-fix text--extra-bold ember-view">M / Test - Test (MI) #210510
                  <span data-test-ticket-id="2595" class="muted">
                    #2595
                  </span>
                </a>
              </div>
              <div id="ember-basic-dropdown-content-ember3809" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>



            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 400px" id="ember2373" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="_test_label" id="ember2374" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="assign-to-hover" id="ember2375" class="group-agent ember-view">
            <div data-test-id="group-agent" id="ember3844" class="__module-tickets__assign-to ember-view">
              <div class="group-field  pr-5 mb-0">
                <div data-test-id="group-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Gruppo">

                  <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3846" tabindex="0" data-ebd-id="ember3846-trigger" role="button" id="ember3847" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> Product

                    </span>
                    <!----><span class="ember-power-select-status-icon"></span>
                  </div>
                  <div id="ember-basic-dropdown-content-ember3846" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                </div>
                <div class="agent-field border-left--none">
                  <div class="agent-filter pl-0 mt-0">
                    <div data-test-id="agent-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Agente">

                      <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3852" tabindex="0" data-ebd-id="ember3852-trigger" role="button" id="ember3853" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> --

                        </span>
                        <!----><span class="ember-power-select-status-icon"></span>
                      </div>
                      <div id="ember-basic-dropdown-content-ember3852" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!---->
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2377" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="priority_test_label" id="ember2378" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="priority-hover" id="ember2379" class="priority ember-view">
            <div class="list-filter__label">
              <span class="tickets__list--low tickets__list--dropdown"></span> Low
              <!---->
            </div>

            <span class="ember-power-select-status-icon priority-icon"></span>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2381" class="lt-cell align-left ember-view">
        <div data-test-id="statusTranslatedLabel_test_label" id="ember2382" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="status-hover" id="ember2383" class="status-select ember-view">
            <div class="pull-left list-filter__label" aria-label="Stato">
              Open
              <span class="ember-power-select-status-icon"></span>
            </div>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2384" class="lt-cell align-left ember-view">
        <div data-test-id="company.name_test_label" id="ember2385" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> <span class="inactive">- -</span>
          <!---->
        </div>
      </td>
      <td style="width: 180px" id="ember2386" class="lt-cell align-left ember-view">
        <div data-test-id="createdAt_test_label" id="ember2387" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> 23º set 2020, 06:21 PM
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2388" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2389" class="hcell-template ember-view"> <span class="inactive">- -</span>
        </div>
      </td>
      <td style="width: 200px" id="ember2390" class="lt-cell align-left ember-view">
        <div data-test-id="stats.requesterRespondedAt_test_label" id="ember2391" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> <span class="inactive">- -</span>
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2392" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2393" class="hcell-template ember-view"> <span class="inactive">- -</span>
        </div>
      </td>
      <td style="width: 160px" id="ember2394" class="lt-cell align-left ember-view">
        <div data-test-id="custom_checkbox_test_label" id="ember2395" class="hcell-template ember-view"> No
        </div>
      </td>
    </tr>


    <tr data-test-id="ticket-row-2454" data-row-id="ember2396" colspan="1" id="ember2397" class="lt-row is-selectable ember-view">
      <td style="width: 50px" id="ember2398" class="lt-cell align-left ember-view">
        <div id="ember2399" class="ember-view">
          <div data-test-id="table-checkbox" id="ember2400" class="input __ui-form__custom-checkbox custom-checkbox ember-view"><input data-test-checkbox="ticket-checkbox-ember2400" id="checkbox-ember2400" class="trigger-shortcuts ember-checkbox ember-view" type="checkbox">
            <label for="checkbox-ember2400">
              <span class="label-field"></span>
            </label>
          </div>
        </div>
      </td>
      <td style="width: 12vw" id="ember2401" class="lt-cell align-left ember-view">
        <div data-test-id="customer_test_label" id="ember2402" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div class="avatar-info-cell">
            <div class="avatar-image">
              <figure data-test-user-avatar="" id="ember2404" class="profilepic  avatar-icon avatar-icon--small avatar-icon--circle ember-view"> <span data-test-avatar-text="profile_font_text" id="ember2405" class="avatar-block avatar__initial avatar__initial--2 ember-view"><span class="avatar__initial--icon-wrapper">
                    L
                  </span>
                </span>

                <!---->
              </figure>
            </div>
            <div data-test-id="table-view-contact" id="ember2406" class="avatar-text text__content requester-hover ember-view">
              <div id="ember2407" class="ember-view"> <a href="/a/contacts/77039361772" data-test-id="user-name" class="user">
                  Luciano D
                </a>


              </div>
            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 30px" id="ember2409" class="lt-cell align-left lt-cell-autorefresh ember-view">
        <!---->
      </td>
      <td style="width: 24vw" id="ember2411" class="lt-cell align-left ember-view">
        <div data-test-id="subject_test_label" id="ember2412" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div id="ember2413" class="pr-12 ticket-listview-hover __module-tickets__tickets-list__tickets-table__ticket-subject-popover ember-view">
            <div id="ember2414" class="ember-view">
              <div data-test-id="ticket-subject-hover-2454" aria-owns="ember-basic-dropdown-content-ember3804" tabindex="-1" data-ebd-id="ember3804-trigger" role="button" id="ember3805" class="trigger-shortcuts ember-basic-dropdown-trigger ember-view"> <a data-test-link="tickets-subject-2454" href="/a/tickets/2454" id="ember3806" class="link-on-hover link-no-underline wordbreak-fix ember-view">D / Enel - other (CS) #210100 test
                  <span data-test-ticket-id="2454" class="muted">
                    #2454
                  </span>
                </a>
              </div>
              <div id="ember-basic-dropdown-content-ember3804" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>



            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 400px" id="ember2416" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="_test_label" id="ember2417" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="assign-to-hover" id="ember2418" class="group-agent ember-view">
            <div data-test-id="group-agent" id="ember3879" class="__module-tickets__assign-to ember-view">
              <div class="group-field  pr-5 mb-0">
                <div data-test-id="group-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Gruppo">

                  <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3881" tabindex="0" data-ebd-id="ember3881-trigger" role="button" id="ember3882" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> En Sp

                    </span>
                    <!----><span class="ember-power-select-status-icon"></span>
                  </div>
                  <div id="ember-basic-dropdown-content-ember3881" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                </div>
                <div class="agent-field border-left--none">
                  <div class="agent-filter pl-0 mt-0">
                    <div data-test-id="agent-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Agente">

                      <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3887" tabindex="0" data-ebd-id="ember3887-trigger" role="button" id="ember3888" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> Luke D

                        </span>
                        <!----><span class="ember-power-select-status-icon"></span>
                      </div>
                      <div id="ember-basic-dropdown-content-ember3887" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!---->
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2420" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="priority_test_label" id="ember2421" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="priority-hover" id="ember2422" class="priority ember-view">
            <div class="list-filter__label">
              <span class="tickets__list--low tickets__list--dropdown"></span> Low
              <!---->
            </div>

            <span class="ember-power-select-status-icon priority-icon"></span>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2424" class="lt-cell align-left ember-view">
        <div data-test-id="statusTranslatedLabel_test_label" id="ember2425" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="status-hover" id="ember2426" class="status-select ember-view">
            <div class="pull-left list-filter__label" aria-label="Stato">
              Open
              <span class="ember-power-select-status-icon"></span>
            </div>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2427" class="lt-cell align-left ember-view">
        <div data-test-id="company.name_test_label" id="ember2428" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> <span class="inactive">- -</span>
          <!---->
        </div>
      </td>
      <td style="width: 180px" id="ember2429" class="lt-cell align-left ember-view">
        <div data-test-id="createdAt_test_label" id="ember2430" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> 21º set 2020, 09:19 AM
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2431" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2432" class="hcell-template ember-view"> Waiting customer reply
        </div>
      </td>
      <td style="width: 200px" id="ember2433" class="lt-cell align-left ember-view">
        <div data-test-id="stats.requesterRespondedAt_test_label" id="ember2434" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> 14 hours ago
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2435" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2436" class="hcell-template ember-view"> Waiting customer reply
        </div>
      </td>
      <td style="width: 160px" id="ember2437" class="lt-cell align-left ember-view">
        <div data-test-id="custom_checkbox_test_label" id="ember2438" class="hcell-template ember-view"> No
        </div>
      </td>
    </tr>


    <tr data-test-id="ticket-row-2385" data-row-id="ember2439" colspan="1" id="ember2440" class="lt-row is-selectable ember-view">
      <td style="width: 50px" id="ember2441" class="lt-cell align-left ember-view">
        <div id="ember2442" class="ember-view">
          <div data-test-id="table-checkbox" id="ember2443" class="input __ui-form__custom-checkbox custom-checkbox ember-view"><input data-test-checkbox="ticket-checkbox-ember2443" id="checkbox-ember2443" class="trigger-shortcuts ember-checkbox ember-view" type="checkbox">
            <label for="checkbox-ember2443">
              <span class="label-field"></span>
            </label>
          </div>
        </div>
      </td>
      <td style="width: 12vw" id="ember2444" class="lt-cell align-left ember-view">
        <div data-test-id="customer_test_label" id="ember2445" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div class="avatar-info-cell">
            <div class="avatar-image">
              <figure data-test-user-avatar="" id="ember2447" class="profilepic  avatar-icon avatar-icon--small avatar-icon--circle ember-view"> <span data-test-avatar-text="profile_font_text" id="ember2448" class="avatar-block avatar__initial avatar__initial--3 ember-view"><span class="avatar__initial--icon-wrapper">
                    A
                  </span>
                </span>

                <!---->
              </figure>
            </div>
            <div data-test-id="table-view-contact" id="ember2449" class="avatar-text text__content requester-hover ember-view">
              <div id="ember2450" class="ember-view"> <a href="/a/contacts/77039270383" data-test-id="user-name" class="user">
                  Alessio B
                </a>


              </div>
            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 30px" id="ember2452" class="lt-cell align-left lt-cell-autorefresh ember-view">
        <!---->
      </td>
      <td style="width: 24vw" id="ember2454" class="lt-cell align-left ember-view">
        <div data-test-id="subject_test_label" id="ember2455" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div id="ember2456" class="pr-12 ticket-listview-hover __module-tickets__tickets-list__tickets-table__ticket-subject-popover ember-view">
            <div id="ember2457" class="ember-view">
              <div data-test-id="ticket-subject-hover-2385" aria-owns="ember-basic-dropdown-content-ember3799" tabindex="-1" data-ebd-id="ember3799-trigger" role="button" id="ember3800" class="trigger-shortcuts ember-basic-dropdown-trigger ember-view"> <a data-test-link="tickets-subject-2385" href="/a/tickets/2385" id="ember3801" class="link-on-hover link-no-underline wordbreak-fix ember-view">B / cars - other (MI) #209884
                  <span data-test-ticket-id="2385" class="muted">
                    #2385
                  </span>
                </a>
              </div>
              <div id="ember-basic-dropdown-content-ember3799" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>



            </div>
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 400px" id="ember2459" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="_test_label" id="ember2460" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="assign-to-hover" id="ember2461" class="group-agent ember-view">
            <div data-test-id="group-agent" id="ember3831" class="__module-tickets__assign-to ember-view">
              <div class="group-field  pr-5 mb-0">
                <div data-test-id="group-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Gruppo">

                  <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3833" tabindex="0" data-ebd-id="ember3833-trigger" role="button" id="ember3834" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> Product

                    </span>
                    <!----><span class="ember-power-select-status-icon"></span>
                  </div>
                  <div id="ember-basic-dropdown-content-ember3833" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                </div>
                <div class="agent-field border-left--none">
                  <div class="agent-filter pl-0 mt-0">
                    <div data-test-id="agent-select" class="assign-to-select hcell-template hint hint--left pl-10 pr-10" aria-label="Agente">

                      <div aria-activedescendant="-1" aria-owns="ember-basic-dropdown-content-ember3839" tabindex="0" data-ebd-id="ember3839-trigger" role="button" id="ember3840" class="ember-power-select-trigger ember-basic-dropdown-trigger ember-view"> <span class="ember-power-select-selected-item"> Michael

                        </span>
                        <!----><span class="ember-power-select-status-icon"></span>
                      </div>
                      <div id="ember-basic-dropdown-content-ember3839" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>

                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!---->
          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2463" class="lt-cell align-left lt-cell-truncate ember-view">
        <div data-test-id="priority_test_label" id="ember2464" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="priority-hover" id="ember2465" class="priority ember-view">
            <div class="list-filter__label">
              <span class="tickets__list--low tickets__list--dropdown"></span> Low
              <!---->
            </div>

            <span class="ember-power-select-status-icon priority-icon"></span>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2467" class="lt-cell align-left ember-view">
        <div data-test-id="statusTranslatedLabel_test_label" id="ember2468" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view">
          <div data-test-id="status-hover" id="ember2469" class="status-select ember-view">
            <div class="pull-left list-filter__label" aria-label="Stato">
              Open
              <span class="ember-power-select-status-icon"></span>
            </div>

          </div>
          <!---->
        </div>
      </td>
      <td style="width: 120px" id="ember2470" class="lt-cell align-left ember-view">
        <div data-test-id="company.name_test_label" id="ember2471" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> <span class="inactive">- -</span>
          <!---->
        </div>
      </td>
      <td style="width: 180px" id="ember2472" class="lt-cell align-left ember-view">
        <div data-test-id="createdAt_test_label" id="ember2473" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> 18º set 2020, 06:13 AM
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2474" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2475" class="hcell-template ember-view"> <span class="inactive">- -</span>
        </div>
      </td>
      <td style="width: 200px" id="ember2476" class="lt-cell align-left ember-view">
        <div data-test-id="stats.requesterRespondedAt_test_label" id="ember2477" class="hcell-template __module-tickets__tickets-list__tickets-table__cell-renderer ember-view"> 14 hours ago
          <!---->
        </div>
      </td>
      <td style="width: 160px" id="ember2478" class="lt-cell align-left ember-view">
        <div data-test-id="custom_dropdown_test_label" id="ember2479" class="hcell-template ember-view"> Waiting customer reply
        </div>
      </td>
      <td style="width: 160px" id="ember2480" class="lt-cell align-left ember-view">
        <div data-test-id="custom_checkbox_test_label" id="ember2481" class="hcell-template ember-view"> No
        </div>
      </td>
    </tr>


  </tbody>
</table>



<span class="muted">
  Muted class else where
</span>
<br>
<br>
<span class="muted">
  Another muted span 
</span>

ATD · Accepted Answer · 2020-09-24 08:04:09Z

1

try:

span["data-test-ticket-id"] {display:none}

answered Sep 24, 2020 at 8:04

ATD

1,3641 gold badge7 silver badges8 bronze badges

Comments

Nurbek Boymurodov · Accepted Answer · 2020-09-24 08:06:45Z

1

you can use css by like this

span.muted {
   display: none;
}

or if you want to use jquery

$('span.muted').hide();

or

$('span.muted').css('display', 'none');

there are a lot way to hide something in html with css and jquery, you can use whatever you want

answered Sep 24, 2020 at 8:06

Nurbek Boymurodov

5423 silver badges11 bronze badges

Comments

flyingfox · Accepted Answer · 2020-09-24 08:08:23Z

1

As the comment said in your original question, just use CSS can do it:

.muted{
  display:none;
}

You can test it at JSFiddle

answered Sep 24, 2020 at 8:08

flyingfox

13.5k4 gold badges30 silver badges43 bronze badges

Collectives™ on Stack Overflow

Hide html element based on every attribute value jquery

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related