show-hide DIV with CONTACT FORM 7 on Selectable Recipient with Pipes


Staff member
Borrowing code from this link:
<a href="" rel="nofollow"></a>

I created the following, but because the value has a pipe character, it isn't working. When I remove the pipe, it functions properly. I tried escaping but that didn't work. Any thoughts?

My HTML code in the Contact Form 7 plugin

&lt;p&gt;Your Name (required)&lt;br /&gt;
[text* your-name] &lt;/p&gt;

&lt;p&gt;Your Email (required)&lt;br /&gt;
[email* your-email] &lt;/p&gt;

&lt;label for="recipient"&gt;Choose your interest&lt;/label&gt;
[select* recipient id:recipient include_blank 
 "events|[email protected]"
 "custom orders|[email protected]"]

 &lt;div class="hide" id="hide1"&gt;
 &lt;label for="event-type"&gt;Type of Event&lt;/label&gt;[text event-type /50 id:event-type]

 &lt;p&gt;Your Message&lt;br /&gt;
 [textarea your-message] &lt;/p&gt;

 &lt;p&gt;[submit "Send"]&lt;/p&gt;

My jQuery script:

$(document).ready(function() {

    //Hide the field initially

    //Show the text field only when the third option is chosen - this doesn't
    $('#recipient').change(function() {
            if ($("#recipient").val() == "events|[email protected]") {
            else {