I have a jQuery function that alters titles in Wordpress and I tried to add a link to the title and it's not behaving right -

here's function:

$('.entry-title').each(function() {     var dotdotdot = $(this).html().indexof('…');      $(this).html('<a href="<?php the_permalink(); ?>"><span class="category">' + $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot) + '</a>'); }); 

the original intent add span tag text of title , worked beautifully (thanks @making3). code <a href="<?php the_permalink(); ?> + '</a>'is later added original function.

what trying wrap link around title link single post page. screwy part these titles looping through each post on page backwards , creating multiple empty links every post. last link has title in it, it's not correct link title. did totally wrong.

here's markup:

<article <?php post_class(); ?>> <script> $('.entry-title').each(function() {     var dotdotdot = $(this).html().indexof('…');      $(this).html('<a href="<?php the_permalink(); ?>"><span class="category">' +     $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot) + '</a>'); }); </script>   <header>     <h2 class="entry-title"><?php the_title(); ?></h1>   </header>   <div class="entry-summary">     <div class="entry">       <?php the_content(); ?>     </div>   </div> </article> 

can help?

it looks though you've modified jquery code follows:

<script> $('.permalink').each(function() {     var dotdotdot = $(this).html().indexof('…');      $(this).html('<span class="category">' + $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot)); }); </script> 

i'm sure looks fine on page behind scenes outputting jquery code each post , since .each function operates on every post in each instance of code results in multiple nested span tags.

right html getting rendered following through jquery:

<h2 class="entry-title"><a href="/crushing-on/crushing-on-making-a-change/" class="permalink"><span class="category"><span class="category"><span class="category"><span class="category"><span class="category"><span class="category">crushing on</span></span></span></span></span></span>…making change</a></h2> 

(right click element in chrome , click inspect element see yourself)

this happening because of multiple instances of jquery code when want once instance operate on links. fix put jquery code block @ top of page outside php loop generating posts gets output once.