D
I don't understand why you're saying what you're looking for is not a tender operator. If a tender operator solves your problem it should serve you, otherwise you should explain why you don't want to use it.Before giving you a possible solution, go through the recommendations I left on https://es.stackoverflow.com/questions/294795/jquery-suma-de-inputs-dinamicos-con-condicional/296090#296090 I think they could help you.Now, back to your code. You must not write code HTML using jQuery, if the table has elements that are fixed and do not vary, place these elements directly in the code HTML. Doing it the way you're doing it, not only complicate your code and make it harder to read, scale and maintain, but you create other problems like the one you're presenting.In the following solution I used one of the tips I left in the linked response. Use a template template template template for rows will help you keep the code separate JavaScript and HTMLapart from being much easier to read and edit. Using this technique, you can simply make a https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map of array opcion to create a array of rows, which, depending on a tender condition, will return the template template template template of each row replacing the part corresponding to the first column with one string or another.As you can see, using this solution not only eliminates the complication of connecting chains with a cycle and an intermediate condition, but the code is much easier to read and understand:var opcion = ['BBVA', 'SANTANDER', 'BANCO PLAZA', 'BANK OF AMERICA'];
var $body = $("#mi_tabla tbody");
var template = $("#row_template").html();
var rows = opcion.map(function (op) {
return template.replace("{{banco}}", op === "SANTANDER" ? "Santander" : op);
});
$body.append(rows);<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-12 my-4" id="table">
<table id='mi_tabla' class='table table-sm table-striped table-bordered' style='width:100%'>
<thead>
<tr>
<th scope='col'>Banco</th>
<th scope='col'>Saldo</th>
<th scope='col'>PM%EST</th>
<th scope='col'>PM%SIS</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<template id="row_template">
<tr>
<td class='bg-success'>{{banco}}</td>
<td>20000</td>
<td>500,00</td>
<td>100</td>
</tr>
</template>Edition: Reading your comment, it seems that your data is more complex than a simple array (the code is intended for the specific case you had placed in the question). If you need to return a different template for each row depending on conditions located in each of your cells, here I leave you another example using the same method with a more complex structure. By conditions different values are returned by cells (in the example I only make the conditions in cells belonging to two columns):var datos = [
{ banco: "BBVA", saldo: "20000", pmest: "500,00", pmsis: "100"},
{ banco: "SANTANDER", saldo: "10000", pmest: "400,00", pmsis: "200" },
{ banco: "BANCO PLAZA", saldo: "50000", pmest: "300,00", pmsis: "700" },
{ banco: "BANK OF AMERICA", saldo: "40000", pmest: "100,00", pmsis: "200" }
];
var $body = $("#mi_tabla tbody");
var template = $("#row_template").html();
var filas = datos.map(function (fila) {
return template.replace(/{{(\w+)}}/g, function (m, p) {
switch (p) {
case "banco":
return fila[p] === "SANTANDER" ? "Santander" : fila[p];
case "saldo":
return +fila[p] > 10000 ? "<del>" + fila[p] + "</del>" : fila[p];
default:
return fila[p];
}
});
});
$body.append(filas);<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-12 my-4" id="table">
<table id='mi_tabla' class='table table-sm table-striped table-bordered' style='width:100%'>
<thead>
<tr>
<th scope='col'>Banco</th>
<th scope='col'>Saldo</th>
<th scope='col'>PM%EST</th>
<th scope='col'>PM%SIS</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<template id="row_template">
<tr>
<td class='bg-success'>{{banco}}</td>
<td>{{saldo}}</td>
<td>{{pmest}}</td>
<td>{{pmsis}}</td>
</tr>
</template>
