检查图像是否在线，然后将其附加到其父div

Question

我使用一个函数来检查图像是否在线。如果是这样，它将作为其父容器的背景附加。 Js-part包含在头部。下面有一些次要的js文件。我认为这使得在触发check-alive函数之前加载图像。结果是图像未被检查并附加到父div。如何确保早期触发该功能？

(function($) {
  $("figure.card-head img").on({
    load: function() {
      var source = $(this).attr("src");
      $(this).closest("figure").css("background-image", "url(" + source + ")");
      $(this).remove();
    },
    error: function() {
      $(this).parent().remove();
    }
  });
)(jQuery);

<div class="col-4_sm-12">
        <div class="thecard">
            <figure class="card-head">
                <img id="c131969" src="http://beitostolen.no/webcam/sentrum.jpg" />
            </figure>
            <div class="card-caption">
                <a href="#like" class="like-btn fa fa-thumbs-o-up"></a>
                       <span class="date">Thursday, July 16, 2015</span>
                    <h3>Beitostolen centre</h3>
                    <p></p>
                    <p>   </p>
            </div>
            <a class="card-outmore" href="/review/beitostolen/131969/">
                <i class="outmore-icon fa fa-angle-right"></i>
            </a>
        </div>
    </div>