Abrir mas de un modal

[xfxstudios]

Has estos cambios a ver, estan con jquery:

Código HTML:

<h2>Ejemplos</h2>
<button data-modal="myModal" class="boton" id="myBtn">Abrir Modal</button>
<!-- The Modal -->
<div id="myModal" class="modal">
  <div class="modal-content">
    <span class="close">&times;</span>
    <p>Un intercomunicador es un dispositivo de intercomunicación. Puede definirse como un sistema independiente de comunicación electrónica destinado a un diálogo limitado o privado. Los intercomunicadores pueden ser portátiles, pero son generalmente instalados permanentemente en negocios, edificios y hogares. </p>
  </div>
</div>
 
<button data-modal="myModal2" class="boton" id="myBtn2">Abrir otro Modal</button>
<div id="myModal2" class="modal">
  <div class="modal-content">
    <span class="close">&times;</span>
    <p>Detección de fugas eléctricas con meghómetro, instalaciones eléctricas en general, cableados, mediciones eléctricas, tableros thermomagnéticas, balanceos de carga, instalaciones de MT,BT. Protocolos de mediciones eléctricas.</p>
  </div>
</div>
 

Código Javascript:

$('.boton').click(function(){
        var id = $(this).attr('data-modal');
    $("#"+id).css('display','block');
});
 
$(".close").click(function(){
        $(this).parent().parent().css('display','none');
})
 
$(".modal").click(function(event) {
        $(this).css('display','none')
})
 

en CSS queda igual

MUESTRA