JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>
<div class="container">
  <div class="background-image">
    <div class="shell"></div>
    <div class="mask" data-role="mask" data-color="#e34450" data-opacity="0.5"></div>
    <img src="http://previews.123rf.com/images/william87/william871307/william87130700049/20680411-Young-Couple-with-Guitar-at-Park-Stock-Photo.jpg">
  </div>

</div>

<script src="https://d3js.org/d3.v4.js"></script>
<script>
  $(document).ready(function() {

    function maskMaker(el) {

      var backcolor = $(el).data("color");
      var backopacity = $(el).data("opacity");

      // Set the main elements for the series chart
      var svgroot = d3.select($(el)[0]).append("svg");
      var mask = svgroot
        .append("defs")
        .append("mask")
        .attr("id", "myMask");

      mask.append("rect")
        .attr("x", 0)
        .attr("y", 0)
        .attr("width", "1200px")
        .attr("height", 500)
        .style("fill", "white")
        .style("opacity", backopacity);

      mask.append("circle")
        .attr("cx", 550)
        .attr("cy", 250)
        .attr("r", 150);

      var svg = svgroot
        .attr("class", "series")
        .attr("width", "1200px")
        .attr("height", "500px")
        .append("g")
        .attr("transform", "translate(0,0)")

      var rect = svg
        .append("rect")
        .attr("x", 0)
        .attr("y", 0)
        .attr("width", "1200px")
        .attr("height", 500)
        .attr("mask", "url(#myMask)")
        .style("fill", backcolor);

    }

    //var el = $(".mask"); //selector

    $('[data-role="mask"]').each(function(index) {
      console.log("test")
      maskMaker(this);
    });

  });

</script>

<style>
  .mask {
    position: absolute;
  }

</style>

CSS

.background-image {
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  z-index: 0;
}

.container {
  overflow: hidden;
  width: 1100px;
  height: 460px;
  position: relative;
}