JSFiddle - React, Tailwind, and code Playground

by Devidas Kadam

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<div class="overlay" data-url="http://www.example1.org">
   Lorem ipsum dolor sit amet, consectetur adipisicing elit
<br>
   <a class="link1 clickThis" href="http://www.example2.org">
     first link
  </a>
    <br>
  <a class="link2 clickThis" href="http://www.example3.org">
     Second link
  </a>`
</div>

JavaScript

$('.overlay').click(function(event) {
        event.preventDefault();
        window.location.href = $(this).attr('data-url');
    }).children('a').click(function(event) {
         return false;  
    });

// methods call on link click
$(document).on('click', '.clickThis', function(event) {
event.preventDefault();
$.ajax({
        url: $(this).attr('href'),
        type: 'GET',
        data: {
            param1: 'value1'
        },
    })
    .done(function() {
        console.log("success");
    })
});

$('.overlay:not(.link1,.link2)').click(function(event) {
        event.preventDefault();
        window.location.href = $(this).attr('data-url');
    });