单击图像后显示iframe

Question

我试图在点击图像后注入iframe，我可以让它在没有注入的情况下工作，因此它出现在页面的开头但不是按下图像时。我该怎么做？

查看：

@extends('layouts.master')

@section('title', 'Best programmer ever')
@section('content')
    <script type="text/javascript" src="{!! asset('/js/jquery-3.1.1.min.js') !!}"></script>
    <script type="text/javascript" src="{!! asset('/js/template.js') !!}"></script>
@endsection
        @section('template')
        <div class= "template_class">
            @foreach ($templates as $template)

        <img id = "image" src="{{ asset($template->image )}}"/>
        </a>
            @endforeach
        </div>
            <iframe class="content-link" src="{{ asset($template->file )}}">
@show

Jquery的：

$(function(){
   $('.content-link').click(function(e){
       e.preventDefault();
       $('.template_class').load(this.src);

   });
});