Question

How can I show/hide the answers for below external .js file using a ‘toggle’ button ? If I had access to the code I could wrap the answers in a div but since this is an external .js file is this possible ?

Heres the fiddle & code :

http://jsfiddle.net/Wx5mM/

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript">
      $(document).ready(function() {
        $(".pds-pd-link").hide();
        $(".a2a_dd.pds-share").hide();
        $(".pds-box").width(220);
      });
    </script>
    <script type="text/javascript" charset="utf-8" src="http://static.polldaddy.com/p/5968383.js"></script>
    <noscript><a href="http://polldaddy.com/poll/5968383/">This is a test question ?</a></noscript>

Answer 1

The external JavaScript just adds elements to the DOM so its possible to manipulate them using jQuery, something like this would work :

$(document).ready(function() {
    $('.pds-question').append('<input type="button" class="showanswer" value="show answer"/>');
    $('.pds-answer').hide();
    $('.showanswer').click(function() {
        $(this).parent().next().show();
    });
});​

Working example here

Use .append() to add button, then hide the answers. The .click() function then shows the answers