Change NAME attribute onClick with Jquery

I am trying to change the NAME attribute of a DIV for the content of a textbox using jQuery.

Here's my fiddle:

What am I doing wrong?


The biggest problem is a logic problem.

content = document.getElementById("theid").value

This gets the current value of the input. The problem is, it does not get updated when you change the value of the input. To solve that, move the line into the click event handler.

Once the various other javascript errors are fixed (Click the JSLint button!!!), it will work.

Instead of:



$("#divId").attr("name", content);

attr is a function not a property.

Keep the same code, only change the JS for this:

$('#buttonId').click(function() {
    $('#divId').attr('name', $('#textId').val());

Keep in mind it only changes the name of the div, you'll need something like Google Chrome's developer tools to see it change.

The way to use .attr() to set the value of the attribute is:

.attr( attributeName, value ) Description: Set one or more attributes for the set of matched elements.

attributeName: the name of the attribute to set. value: a value to set for the attribute.

$('#divId').attr("name", content);

Note: don't forget to surround your selectors with quotes (or double quotes) within the jQuery function $() That should get you what you want.

Need Your Help

Distracting Red Icons in Visual Studio 2013

ide typescript visual-studio-2013

Visual Studio 2013 displays all my TypeScript files with a red icon:

Save to local Google Datastore with PHP

php google-app-engine google-cloud-datastore

The following code inserts an entity into the remote Google Datastore: