Home / Questions / 280319
Accepted
Gian Franco Alexis Poma Vidal
Asked: 2020-07-20 21:12:00 +0800 CST 2020-07-20 21:12:00 +0800 CST

How to get the value of the elements with the each() function?

  • 772

I want to get the value of the label tags with the Jquery each() function, but it gives me an error that the element parameter is NOT a function. How can I fix that?

$(".lbl-asistencia").each(function(index, element){
	console.log(element.text());
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>


<table class="table">
    <tbody><tr>
        <th>
            id_alumno
        </th>
        <th>
            dni_alumno
        </th>
        <th>
            nombre_alumno
        </th>
        <th>
            ape_pat_alumno
        </th>
        <th>
            ape_mat_alumno
        </th>
        <th>
            asistencia_alumno
        </th>
        <th></th>
    </tr>

    <tr>
        <td>
            1
        </td>
        <td>
            76475156
        </td>
        <td>
            GIAN FRANCO ALEXIS
        </td>
        <td>
            POMA
        </td>
        <td>
            VIDAL
        </td>
        <td>
            <label class="lbl-asistencia">FALTO</label>
            <input type="checkbox" class="chk-asistencia">
            <input type="text" class="txt-asistencia">
        </td>
        <td>
            <a href="/Charlas/Edit">Edit</a> |
            <a href="/Charlas/Details">Details</a> |
            <a href="/Charlas/Delete">Delete</a>
        </td>
    </tr>
    <tr>
        <td>
            2
        </td>
        <td>
            76475155
        </td>
        <td>
            GONZALO ALONSO
        </td>
        <td>
            GODOS
        </td>
        <td>
            VERA
        </td>
        <td>
            <label class="lbl-asistencia">FALTO</label>
            <input type="checkbox" class="chk-asistencia">
            <input type="text" class="txt-asistencia">
        </td>
        <td>
            <a href="/Charlas/Edit">Edit</a> |
            <a href="/Charlas/Details">Details</a> |
            <a href="/Charlas/Delete">Delete</a>
        </td>
    </tr>
    <tr>
        <td>
            3
        </td>
        <td>
            76475154
        </td>
        <td>
            DRUCILA
        </td>
        <td>
            VIDAL
        </td>
        <td>
            CALDERÓN
        </td>
        <td>
            <label class="lbl-asistencia">ASISTIO</label>
            <input type="checkbox" class="chk-asistencia">
            <input type="text" class="txt-asistencia">
        </td>
        <td>
            <a href="/Charlas/Edit">Edit</a> |
            <a href="/Charlas/Details">Details</a> |
            <a href="/Charlas/Delete">Delete</a>
        </td>
    </tr>

</tbody></table>

javascript

1 Answers

  1. Best Answer

    The property that you must access to obtain the value of each labelis textContentand this must be accessed as a property and not as a method; being that way:

    $(".lbl-asistencia").each(function(index, element){
    console.log(element.textContent);
});

    Resulting:

    "FALTO"
"FALTO"
"ASISTIO"

    You can check this by doing:

    $(".lbl-asistencia").each(function(index, element){
    console.log(element);
});

    And check the section that says something like the following:

     tabIndex: -1,
  tagName: "LABEL",
  TEXT_NODE: 3,
  textContent: "ASISTIO",
  title: "",
  toggleAttribute: function toggleAttribute() { [native code] },
  translate: true,
  webkitMatchesSelector: function webkitMatchesSelector() { [native code] },
  webkitRequestFullScreen: function webkitRequestFullScreen() { [native code] },
  webkitRequestFullscreen: function webkitRequestFullscreen() { [native code] }
}
    • 2