javascript - JQuery - クリックして同じ関数にカーソルを合わせる

Question

私はこのjQueryスクリプトを持っています:

$('img[data-hover]').hover(function() {
    $(this)
        .attr('tmp', $(this).attr('src'))
        .attr('src', $(this).attr('data-hover'))
        .attr('data-hover', $(this).attr('tmp'))
        .removeAttr('tmp');
}).each(function() {
    $('<img />').attr('src', $(this).attr('data-hover'));

});  

画像をホバーすると、ホバーは正常に機能します。

しかし、特定のボックスをクリックすると、ホバーを再度開始する必要があります。

$('#first, #second, #third').click(function(){  .....  

「クリックで」ホバーを開始し、実際のホバー機能を維持することは何とか可能ですか? それとも「関数」に変更しますか？

私はそれを試しましたが、失敗しました。
ありがとう。

編集：
画像付きのHTMLコードは次のとおりです。

<div class="auswahlbox">
        <div class="auswahl" id="first" data-id="1">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
        <div class="auswahl" id="second" data-id="2">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
        <div class="auswahl" id="third" data-id="3">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
    </div>    

現在の状況:
画像を .bild に保存すると、正常に動作します。

必要なもの：
（2番目、3番目の）div をクリックする"<div class="auswahl" id="first" data-id="1">"と、画像のホバーが1回「開始」されます。