Using javascript for dynamic images in Laravel
<p>For my laravel website, I have a nav and an image container. </p>

<p>The image inside of the container changes based on which nav item you mouseover.</p>

<pre><code>   $(".ddNavItem a, .tier1Nav2").mouseenter(function(){
        itemID = $(this).attr('id');
        newImg = "&lt;img src='images/nav/" + itemID + ".png' &gt;";
        $(".dropImg").html(newImg);
   });
</code></pre>

<p>Now this was working just fine until I switched my website over to laravel. My nav now only works in website's root public directory.</p>

<p>So I tried using the asset tag. </p>

<pre><code>    $(".ddNavItem a, .tier1Nav2").mouseenter(function(){
        itemID = $(this).attr('id');
        newImg = "&lt;img src='{{ asset('images/nav/" + itemID + ".png') }}' &gt;";
        $(".dropImg").html(newImg);
   });
</code></pre>

<p>This didn't work. The path came out as</p>

<pre><code>http://localhost/mysite/public/images/nav/" + itemID + ".png
</code></pre>

<p>Been stuck on this for a few hours and I was wondering if anyone could help out. Thank you in advance!</p>