When trying to show a div:
<div class="modalHome">
HOLA MUNDO
</div>'
$(".modificar-foto-perfil").on("click", function() {
$('.modalHome').show();
});
<i id="modificar-foto-perfil" class="fa fa-pencil fa-sm" aria-hidden="true" title="Modificar imagen"></i>
.modalHome {
position: absolute;
display: none;
}
It does not show the div, I do not know if it has something to do with the label
Well you're right but in my code that did not work in any way, I was spinning because it had another identical div and that worked, after looking a lot of renaming elements, using id or class, changing site elements, etc and search online I found this:
$ (document) .on ("click" ... not working?
$(document).on("click","#test-element",function() {
alert("click");
});
Thanks for the help.
Try the following code:
Capture with "#" the element "modify-photo-profile", basically it's just that:
$(document).ready(function(){
$("#modificar-foto-perfil").click(function() {
$(".modalHome").show();
});
});.modalHome {
position: absolute;
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="modalHome">
HOLA MUNDO
</div>
<br/>
<i id="modificar-foto-perfil" class="fa fa-pencil fa-sm" aria-hidden="true" title="Modificar imagen">CLICK</i>You are calling the event wrong, you are calling it as a class. modify-photo-profile when in the i you have declared it as ID id="modify-photo-profile", you have to call it with #: '# modify-photo -profile '
<style>
.modalHome {
position: absolute;
display: none;
}
</style>
<div class="modalHome">
HOLA MUNDO
</div>
<br>
<!-- Aca tenes el ID al que al darle click inicia el evento de mostrar el div -->
<i id="modificar-foto-perfil" class="fa fa-pencil fa-sm" aria-hidden="true" title="Modificar imagen">CLICK</i>
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<!-- Pero aca lo estabas llamando como clase con el . tenes que ponerle el # -->
<script>
$("#modificar-foto-perfil").on("click", function() {
$('.modalHome').show();
});
</script>