How to show and hide textbox depening on mutliple select box in joomla 3.x

Question

I am currently developing simple custom component in joomla 3.x for sending mails to customers. In that I have one multiple select box with option to choose the customer group like members,non-members,individual.

If i choose the option Individual then i need to show the text box for enter the individual customer mail id. other two option for send mass mail.

I need the help to active show and hide function depends on the option using jquery.

Answer 1

I would "improve" your code in 3 aspects:

1. Stay DRY (don't repeat yourself)
2. Only use jQuery if it is necessary
3. Choose scope wisely

var toggleVisbility = function( aVal, $Element ) { // #1, #2, #3
    $Element[0].style.display = aVal.indexOf('3') !== -1 ? 'initial' : 'none'; // #2
    return $Element; // #1 chainable
};

jQuery(function() { // document ready

    var $EmailId = jQuery(".emailid"),
        $FormTo  = jQuery("#jform_to") // #1
            .on('change click', function() { // #1 | on change click
                toggleVisbility( $FormTo.val(), $EmailId); // #1
            })
            .click();// #1 | trigger click on document ready

});