$('single_add_to_cart_button').on 'click', () ->
  if document.addEventListener 'DOMContentLoaded', (event) ->
  styles =
  'display': 'inline'
  'opacity': '1'
  'background-color': '#000'
  $('.modal.fade').css styles

<div id="event-modal" class="modal ">
<div class="modal-dialog">
<div class="modal-content">
  <div class="modal-header">
    <a class="close" href="#" onclick="$('#event-modal').hide()">x</a>
    <h3>Modal Heading</h3>
  </div>
  <div class="modal-body">
    <p>Some information</p>
  </div>
  <div class="modal-footer">
    <a class="btn primary" href="#">Primary</a>
    <a class="btn secondary" href="#">Secondary</a>
  </div>
</div>
</div>
<button id="popup"  onclick="$('#event-modal').show()">Open PopUp</button>

</div>