CODEWITHSUNDEEP
jquery
Ambika Tewari
Ambika Tewari

Reputation: 251

Add href to class in jquery

I have a class :

<section class="banner booking-widget-home" data-path="/content/xxx/yyy/en/jcr:content/bookingwidget" data-bgset="/content/dam/xxx/aa-website/banner/2018/pppp/2018/04/abc%def%20Fare_Web%20Banner.png" style="background-image: url(&quot;https://www.abc.in/content/dam/pqr/website/banner/2018/target/2018/04/abc%20Flexi%20Fare_Web%20Banner.png&quot;);">

I want to add href on this class so that when I click the background image, the click should take me to the url mentioned in href. I have tried using : $(".banner.booking-widget-home").attr("href","www.landingpae.com");

but the background image is not clickable.

Upvotes: 0

Views: 34

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167172

Since it's not an <a> tag, the <section> will not be clickable. Instead of using href use onclick and use location.href:

$(function () {
  $(".banner.booking-widget-home").click(function () {
    location.href = "https://example.com/";
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section style="background: url('//placehold.it/100?text=Click+Me') center center; width: 100px; height: 100px; cursor: pointer;" class="banner booking-widget-home"></section>

Upvotes: 1

Related Questions