We Keep Coding

Remove innerHTML img completely by jQuery selection

I've dinamically created a div with the code below:
typebox.innerHTML += "<div id='idtypebox' class='typebox'><img id='typeImg' width='30px' height='30px' src="+d[o].src+"></div>";
My intention is to remove completely the innerHTML I created, by changing the innerHTML that had created the img and if change the form A to B, those images will be removed.
function SelectCheck() {
var select_val = $('#Check').val();
// using this to remove typeimg
var toRemove = document.getElementById('typeImg');
toRemove.parentNode.removeChild(toRemove);
if (select_val) {
ajax_json_gallery("Img/"+select_val);
}
return;
}
$(document).ready(function() {
$("#Check").change(SelectCheck).change();
});
I tried this code by on button and it works, but if I put in jQuery selection I get an error
var toRemove = document.getElementById('typeImg');
toRemove.parentNode.removeChild(toRemove);

Why not just :
$("#typeImg").remove();
And the complete code :
function SelectCheck(){
var select_val = $('#Check').val();
// using this to remove typeimg
$("#typeImg").remove();
if(select_val){
ajax_json_gallery("Img/"+select_val);
}
return;
}

jQuery(document).ready(function($) {
myVar=$("#d1 [href]").html();
var href = $(myVar).attr('src');
$("#d1").html('');
$("#d1").html('<img src="'+href+'" class="images_responsive_mode">').removeAttr("href");
});
</script>
this is one of the script which i created for remove the class assigned by wordpress and to assign new class for responsive image , if it useful for you do this !

you can use childNodes to remove the innerHtml
var toRemove = document.getElementById('typeImg');
toRemove.parentNode.removeChild(toRemove.childNodes[0])

Create "title" attribute using the text inside <a> tag?

Is it possible to take the text inside of an <a> tag and add it to title attribute of that tag using JavaScript?
For example:
Hello
I want the text "hello" to be the title attribute to the <a> tag. Like this:
Hello
Can this be done with JavaScript? Any help or direction would be appreciated.

In javascript, as requested:
var anchors = document.getElementsByTagName('a');
for(i = 0;i < anchors.length; i++) {
anchors[i].title = anchors[i].textContent;
}
http://jsfiddle.net/spencerooni/z97rc/

If you have an ID for the specific tag (e.g. ...):
$('#atag').attr('title', $('#atag').text());
or if you'd like to do this for all a tags:
$('a').each(
function() {
$(this).attr('title', $(this).text());
}
);

DEMO
$('a').each(function() {
var $this = $(this); /* slight optimisation over using $(this) twice */
$this.attr('title',$this.text());
});

In the most simple jQuery form:
$('a').attr('title', function(){ return $(this).text() })
jsFiddle example

how to append a div tag generated by jQuery dynamically with a javascript div tag element

I want to append a div tag generated by jQuery dynamically with a javascript div tag element. My code looks like this:
$(".remove_item").click(function(){
$(this).hide("fast", function(){
var id = $(this).parent().attr("id");
var remove_item_id = document.getElementById(id);
var block_element = document.getElementById("block");
block_element.removeChild(remove_item_id);
new_item = $("<div/>");
new_item.attr("id", "item");
new_item.attr("name", "item");
new_item.addClass("div_image");
new_item.append($("<img/>")
.addClass("image")
.attr("src", "/compare/sites/default/files/add_item.jpg")
.attr("height", 50)
.attr("width", 50));
new_item.append($("<span/>")
.addClass("new_item")
.click(function(){
$(this).parent().remove();
}));
block_element.append(new_item);
});
});
The code for appending the jQuery div tag with javascript div tag should look like this:
block_element.append(new_item);
But its giving error since we cannot bind since I am using javascript and jQuery in the same line. Is there any way to do it?

The only thing, you need to change is
var block_element = $("#block");
$("#"+remove_item_id).remove();
Rest should work as it is.

What you need do is you should convert the JavaScript element to a jQuery object.
$(block_element) could convert the JavaScript element to a jQuery object;
contrarily $(block_element)[0] could convert a jQuery object to a JavaScript element.

You only need to pass the element in the jQuery selector.
First solution (when you append) :
$(block_element).append(new_item);
Second solution (when you select your element)
var block_element = $("#block");

$(".remove_item").click(function(){
$(this).hide("fast", function(){
var elm = $("#block"),
parent = $(this).parent(),
img = $('<img src="/compare/sites/default/files/add_item.jpg" class="image" height="50px" width="50px" />'),
span = $('<span class="new_item"></span>'),
new_item = $('<div id="item" name="item" class="div_image"></div>').append(img).append(span);
elm.remove(parent).append(new_item).on('click', function(){ $(this).parent().remove(); });
});

javascript variable value as a link

I have a variable and I would like to add a link for its value. This below example only returns the html. How can I make this a clickable link when its returned?
var link = 'new link: <b>Clink Here</font></b>'

This should help you:
var myDiv = document.createElement("div");
var link = 'new link: <b>Clink Here</font></b>'
myDiv.innerHTML = link;
document.body.appendChild(myDiv);
For the id:
myDiv.id = "myLink";
alert(document.getElementById('myLink').innerHTML);

You need a container where the HTML will be placed. If you can use jQuery, this becomes very easy.
<div id="container"></div>
var link = '...';
$('#container').html(link);
Working sample: http://jsfiddle.net/mEjUg/

In jQuery:
$("<div />")
.html('new link: <b>Click Here</b>')
.appendTo("body");

Creating links for elements with a particular class with jQuery

How can I wrap every element belonging to a particular class with a link that is built from the text inside the div? What I mean is that I would like to turn:
<foo class="my-class>sometext</foo>
into
<a href="path/sometext" ><foo class="my-class>sometext</foo></a>
Url encoding characters would also be nice, but can be ignored for now if necessary.
EDIT: Just to clarify, the path depends on the text within the element

Use jQuery.wrap() for the simple case:
$(".my-class").wrap("<a href='path/sometext'></a>");
To process text inside:
$(".my-class").each(function() {
var txt = $(this).text();
var link = $("<a></a>").attr("href", "path/" + txt);
$(this).wrap(link[0]);
});

$(".my-class").each(function(){
var thisText = $(this).text();
$(this).wrap("<a></a>").attr("href","path/"+thisText);
});

you can wrap them inside anchor element like this:
$(document).ready(function(){
$(".my-class").each(function(){
var hr="path/"+$(this).text();
$(this).wrap("<a href='"+hr+"'></a>");
});
});
if you are opening links in same page itself then easier way than modifying dom to wrap elements inside anchor is to define css for the elements so that they look like links then handle click event:
$(".my-class").click(function(){
window.location.href="path/"+$(this).text();
});

$("foo.my-class").each(function(){
var foo = $(this);
foo.wrap("<a href='path/" + foo.Text() +"'>");
});

This ought to do it:
$('foo.my-class').each(function() {
var element = $(this);
var text = element.html(); // or .text() or .val()
element.wrap('');
});