tengo varios cuadros de dialogo definidos en mi arcvhivo HTML
<div id="content-top-left-1">
<div id="button"><a href="#VigaModal">Agregar Viga</a></div>
<div id="VigaModal" class="modalmask"></div>
<div class="modalbox movedown" id="uno">
<a href="#close" title="Close" id="close" class="close">X</a>
<h2>AGREGAR VIGA</h2>
<p>Por favor complete todos los campos sin unidades.</p>
<p>
Longitud de la viga:
<input type="number" min="1" id="txtLongViga" name="txtLongViga">
</p>
<form method="post">
{% csrf_token %}
<button class="btn-opc-2" id="btnViga" name="btnViga">AGREGAR</button>
</form>
</div>
<div id="button"><a href="#modalApoyo">Agregar Apoyo</a></div>
<div id="modalApoyo" class="modalmask"></div>
<div class="modalbox movedown" id="dos">
<a href="#close" title="Close" class="close">X</a>
<h2>AGREGAR APOYO</h2>
<p>Por favor complete todos los campos sin unidades.</p>
<div id="modalCP-dialog">
<div id="modalCP-dialog-1">
<p>
Tipo de apoyo:
<select>
{% for i in Apoyos %}
<option value={{ i.id }}>{{ i.apoyo }}</option>
{% endfor %}
</select>
</p>
</div>
<div id="modalCP-dialog-2">
<p>
Ubicación [m]:
<input type="number" min="1">
</p>
</div>
<button class="btn-opc-2">AGREGAR</button>
</div>
</div>
</div>
y necesito acceder al id
de la clase "modalbox movedown"
desde mi archivo .js lo estoy haciendo de la siguiente forma y no he podido.
$(document).ready(function () {
$("#content-top-left-1").on("click", "a", function (event) {
event.stopPropagation();
event.stopImmediatePropagation();
event.preventDefault();
let idSeleccionado = $(this).attr("href")
let idClassSeleccionado = $(this).attr("id")
// let idClassSeleccionado = $("#modalbox movedown").attr("id")
console.log("Hola----", idSeleccionado)
console.log("Hola****", this)
console.log("Hola****", idClassSeleccionado)
// $('.modalmask').show()
$("#dos").show()
// $("#VigaModal").show()
$(idSeleccionado).show()
});
});
Por favor, necesito ayuda...