'Iterate through divs, grab text and append to href as parameter

I have a number of repeating divs on a page and am trying to iterate through them, grab the text in 'contentBlock-heading', and finally append it to the existing href hyperlink. For each href, the end result should look as follows: 'community-chat/registration?ccdatedesc=Thursday, March 17 @ 7 pm CT | 8 pm ET:

<div class="contentBlock  ">
        <div class="contentBlock-media  ">
                <figure>
                    <img class="contentBlock-img" src="community-chat_620px.png" alt="alt text goes here">
                </figure>
                </div>
        <div class="contentBlock-content">
                <h2 class="contentBlock-heading">Thursday, March 17 @ 7 pm CT | 8 pm ET</h2>
                <p><strong>Register to join </strong><sup>®</sup><strong>.</strong></p>
<p><a class="btn btn--secondary" href="community-chat/registration">Save My Spot</a></p>

        </div>
    </div>

I have tried the following:

<script type="text/javascript">
$( document ).ready(function() {
 $('.contentBlock-content').each(function() {
  var ccdatedesc = $(".contentBlock-heading").text();
  $('.contentBlock-content a').attr('href', function(index, attr) {
     return attr + (attr.indexOf('?') >=0 ? '&ccdatedesc=' : '?') + ccdatedesc;
});
});
});

</script>

This successfully appends the text to the href, but unfortunately appends ALL instances of text to each href:

href="community-chat/registration?&ccdatedesc=Thursday, March 17 @ 7 pm CT | 8 pm ETThursday, March 17 @ 7 pm CT | 8 pm ET&ccdatedesc=Thursday, March 17 @ 7 pm CT | 8 pm ETThursday, March 17 @ 7 pm CT | 8 pm ET">Save My Spot</a>

Can any help solve this for me?

jquery


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions