How to find an element in HTML string and change an attribute using jQuery

Question

This seems to be a very simple question but I've been at it for a couple of hours trying to make it work.

I have a string like:

var myhtml = '<div id="wrapper"><div id="full" width="800px"></div></div>';

I need to find my div #full , remove it's "*width*" attribute and then use myhtml with the updated version.

I'm using this in jQuery:

var newhtml = $(myhtml).filter("#full").removeAttr("width");
console.log(newhtml );

Expecting this: <div id="wrapper"><div id="full"></div></div>

But it returns "<div id="full"></div>" and not the whole variable.

Answer 1

Use .find("#full") to select the element then remove attribute. The original object retains the value.

 var myhtml = $('<div id="wrapper"><div id="full" width="800px"></div></div>'); var newhtml = myhtml.find("#full").removeAttr("width"); console.log($(myhtml)[0].outerHTML); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>