jquery - JQueryを使用してhtmlスニペットを既存のhtmlページに挿入する

Question

JQuery を使用して特定の html スニペットを既存の html ページに挿入したいと考えています。既存のスニペット:

<table class="course hoverHighlight">
    <tbody>...</tbody>
       ...
</table>

注入したい：

<thead>
        <tr>
            <th class="title">Course</th>
            <th class="author">Author</th>
            <th class="level">Level</th>
            <th class="rating">Rating</th>
            <th class="duration">Duration</th>
            <th class="releaseDate">Released</th>
        </tr>
</thead>

tbodyタグの前。

<table class="course hoverHighlight">
    <thead>...</thead>
    <tbody>...</tbody>

</table>

このコードを試しましたが、うまくいきませんでした:

function() {
    var theadInjection= $("<thead>
    <tr>
        <th class="title">course</th>
        <th class="author">author</th>
        <th class="level">level</th>
        <th class="rating">rating</th>
        <th class="duration">duration</th>
        <th class="releasedate">released</th>
    </tr>
    </thead>");
   $( '.course' ).prepend(theadInjection);

}

このような単純な注入はうまくいきました：

function() {
    var theadInjection= $("<thead></thead>");
   $( '.course' ).prepend(theadInjection);

ありがとう。