How to Click Checkbox if row contains certain tag

Viewed 19

I want to click the checkbox if the row contains a <mark> element. How can I do this in JS/jQuery?

enter image description here

<table class="views-table cols-4 table table-hover table-striped">
  <thead>
    <tr>
      <th class="views-field views-field-views-bulk-operations">
        <div class="form-item form-type-checkbox checkbox">
          <label class="control-label">
            <input class="vbo-table-select-all form-checkbox" type="checkbox" value="1" style="display: inline-block;">
          </label>
        </div>
      </th>
      <th class="views-field views-field-counter"> View result counter </th>
      <th class="views-field views-field-title"> Title </th>
      <th class="views-field views-field-php"> Correct </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-0 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-0">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-0" name="views_bulk_operations[0]" value="444">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 434 </td>
      <td class="views-field views-field-title"> Which chamber of heart receives oxygenated blood from lungs? </td>
      <td class="views-field views-field-php"> left atrium </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-1 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-1">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-1" name="views_bulk_operations[1]" value="443">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 433 </td>
      <td class="views-field views-field-title">
        <mark>Transport of food in higher plants takes place through:</mark>
      </td>
      <td class="views-field views-field-php"> Sieve elements </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-2 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-2">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-2" name="views_bulk_operations[2]" value="442">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 432 </td>
      <td class="views-field views-field-title"> What happens when food reaches the stomach? </td>
      <td class="views-field views-field-php"> Juices mix with food and stomach muscles squeeze it. </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-3 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-3">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-3" name="views_bulk_operations[3]" value="441">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 431 </td>
      <td class="views-field views-field-title">
        <mark>Oxygen which is released during the process of photosynthesis come from?</mark>? </td>
      <td class="views-field views-field-php"> water </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-4 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-4">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-4" name="views_bulk_operations[4]" value="440">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 430 </td>
      <td class="views-field views-field-title">
        <mark>The prerequisites of Calvin cycle are:</mark>
      </td>
      <td class="views-field views-field-php"> CO<sub>2</sub> + ATP + NADPH </td>
    </tr>
  </tbody>
</table>
1 Answers

To do what you require you can use the :has() selector to find the tr elements which contain a mark, and then find() the checkbox within them.

Also note that you don't need to 'click' the checkbox to set its state, you can update the checked property directly, like this:

$('tr:has(mark)').find(':checkbox').prop('checked', true);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<table class="views-table cols-4 table table-hover table-striped">
  <thead>
    <tr>
      <th class="views-field views-field-views-bulk-operations">
        <div class="form-item form-type-checkbox checkbox">
          <label class="control-label">
            <input class="vbo-table-select-all form-checkbox" type="checkbox" value="1" style="display: inline-block;">
          </label>
        </div>
      </th>
      <th class="views-field views-field-counter"> View result counter </th>
      <th class="views-field views-field-title"> Title </th>
      <th class="views-field views-field-php"> Correct </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-0 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-0">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-0" name="views_bulk_operations[0]" value="444">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 434 </td>
      <td class="views-field views-field-title"> Which chamber of heart receives oxygenated blood from lungs? </td>
      <td class="views-field views-field-php"> left atrium </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-1 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-1">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-1" name="views_bulk_operations[1]" value="443">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 433 </td>
      <td class="views-field views-field-title">
        <mark>Transport of food in higher plants takes place through:</mark>
      </td>
      <td class="views-field views-field-php"> Sieve elements </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-2 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-2">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-2" name="views_bulk_operations[2]" value="442">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 432 </td>
      <td class="views-field views-field-title"> What happens when food reaches the stomach? </td>
      <td class="views-field views-field-php"> Juices mix with food and stomach muscles squeeze it. </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-3 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-3">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-3" name="views_bulk_operations[3]" value="441">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 431 </td>
      <td class="views-field views-field-title">
        <mark>Oxygen which is released during the process of photosynthesis come from?</mark>? </td>
      <td class="views-field views-field-php"> water </td>
    </tr>
    <tr>
      <td class="views-field views-field-views-bulk-operations">
        <div class="form-item form-item-views-bulk-operations-4 form-type-checkbox checkbox">
          <label class="control-label" for="edit-views-bulk-operations-4">
            <input class="vbo-select form-checkbox" type="checkbox" id="edit-views-bulk-operations-4" name="views_bulk_operations[4]" value="440">
          </label>
        </div>
      </td>
      <td class="views-field views-field-counter"> 430 </td>
      <td class="views-field views-field-title">
        <mark>The prerequisites of Calvin cycle are:</mark>
      </td>
      <td class="views-field views-field-php"> CO<sub>2</sub> + ATP + NADPH </td>
    </tr>
  </tbody>
</table>

Related