Question

I am using ajax to get an HTML snippet like this:

<table id='x'>
   <tr>
      <td>
          <a href='http://www.google.com>Click Me</a>
      </td>
   </tr>
</table>

Before displaying the HTML I want to add a target attribute to the anchor tag.

 xhr = $.ajax({
            dataType: 'html',
            type: 'get',
            url: ajaxUrl,
            data: {},
            success: function (data, textStatus) {
                //The next line is the important bit
                $(data).filter('#x').attr({target:'_blank'});
                myDiv
                    .html(data)
                    .fadeIn('slow');                                             
            },
            error: function (x, txt, e) {
                //handle error                    
            }
        });

This does not work. What is the correct way to grab a handle to the manipulated object and use it to set the html of the div?

Answer 1

  var html = $(data);
  html.find('#x').attr('target', '_blank');

  myDiv.html(html); // ...